javascript - 检索动态 ng-model 值时出错

标签 javascript angularjs

我正在开发一个包含多个单选按钮列表的表单,其中我需要为每个单选按钮创建动态 ng-model。我能够做到这一点,但是当我尝试在 Controller 中检索时(使用带有 Angular forEach 循环的 ng-model 迭代),似乎无法使用 console.log 复制模型。有人帮忙吗?

HTML

<html>

<head> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script> 
</head> 

<body ng-app="myApp" ng-controller="myCtrl"> 

<p ng-repeat="x in dummy">
    <input type="radio" name="{{x.name}}" id="{{x.id}}" ng-model="Ques[x.id]"><span>{{x.value}}</span>
</p>
<button ng-click="ok()">Click</button> 

<script>
//module declaration
var app = angular.module("myApp",[]);

//controller
app.controller("myCtrl", function($scope){
    $scope.dummy = [
        {name:"name1",value:"red",id:"id1"},
        {name:"name2",value:"blue",id:"id2"},
        {name:"name3",value:"yellow",id:"id3"},
    ];

    $scope.ok = function(){

        angular.forEach($scope.dummy, function(val, key) {
            console.log($scope.Ques.val.id);
        });
    }

});
</script>

</head> 

</html> 

最佳答案

Angular 模型本身就是一个 JavaScript 对象。您可以将整个对象输出到控制台,如下所示:

console.log( JSON.stringify($scope.dummy) );

为了使复杂对象更易于阅读和跨越多行,只需将这些参数添加到 stringify:

console.log( JSON.stringify($scope.dummy, null, 2) );

看起来您还需要在如何处理单选按钮上做一些工作,我将把它留给优秀的 odetocode 博客/网站:

http://odetocode.com/blogs/scott/archive/2013/06/25/radio-buttons-with-angularjs.aspx

关于javascript - 检索动态 ng-model 值时出错,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38815792/

相关文章:

javascript - 如何让Facebook直播视频嵌入16 :9?

javascript - NodeJs后端代码结构

javascript - 将 CSS 注入(inject)指令

javascript - 将表单字段内容传递到新页面上的同一表单字段

javascript - 使用 HTML 输入 'name' 属性生成对象

javascript - 如何按组获取对象的 Angular 、坐标和比例?

javascript - 使用 onClick 更新数据库

javascript - 避免多重嵌套循环

javascript - 如何根据angularJS中的配置文件加载模块

javascript - 用 Angular 渲染动态占位符