在检索动态ng-model的值时出错。

17 浏览
0 Comments

在检索动态ng-model的值时出错。

我正在处理一个包含多个单选按钮列表的表单，我需要为每个单选按钮创建动态的ng-model。我已经能够做到这一点，但是当我尝试在控制器中检索时（使用ng-model迭代和angular forEach循环），似乎无法通过console.log复制模型。有人能帮忙吗？\nHTML：\n


 
 
 
 


    {{x.value}}

0

3 答案

0 Comments

(Error in retrieving value of dynamic ng-model)这个问题的出现原因是在HTML代码中，ng-model的值是动态生成的，但是在控制器中没有正确地初始化对应的$scope变量。

解决方法是在控制器中给$scope.Ques对象的对应属性赋一个初始值。可以通过遍历$scope.dummy数组，并使用数组中每个元素的id属性作为属性名，给$scope.Ques对象添加对应的属性。代码如下：

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.Ques = {};
    
    // 给$scope.Ques对象添加对应的属性
    angular.forEach($scope.dummy, function(val, key) {
        $scope.Ques[val.id] = '';
    });
    
    $scope.ok = function(){
        angular.forEach($scope.dummy, function(val, key) {
            console.log($scope.Ques[val.id]);
        });
    }
});

这样就解决了错误的问题，并且可以正确地获取动态ng-model的值。

0
0 Comments

问题的原因是在ngRepeat中，它创建了一个子$scope。为了使其正常工作，应该使用“Dot Rule”或“controller-as-syntax”。

解决方法是在view中使用代码`$scope.model = {};`，然后使用以下代码：

在控制器中使用以下代码：

$scope.dummy = [  
  {
    "name":"name1",
    "value":"red",
    "id":"id1"
  },
  {
    "name":"name2",
    "value":"blue",
    "id":"id2"
  },
  {
    "name":"name3",
    "value":"yellow",
    "id":"id3"
  }
];
$scope.model = {};
$scope.ok = function() {
  // With your original code:
  angular.forEach($scope.dummy, function(val, key) {
    console.log($scope.model.Ques[val.id]);
  });
  // Or you can get all key / values stored in radio buttons:
  /*for (var key in $scope.model.Ques) {
    console.log('Key => ', key);
    console.log('Value => ', $scope.model.Ques[key]);
  }*/
}

最后，在HTML中使用以上代码进行引用。

参考文献：链接。

0
0 Comments

问题出现的原因是无法正确获取动态ng-model的值。解决方法是使用console.log()函数将整个对象输出到控制台，并使用JSON.stringify()函数来格式化输出，使其易于阅读和跨多行展示复杂对象。另外，对于处理单选按钮的方式，可以参考odetocode博客/网站上的文章。

0