Question

在使用ng-repeat并附加ng-model的角度项目列表创建多个input[checkbox]es时，我遇到了一个问题：

<li ng-repeat="item in items"> 
  <a ng-href="#/{{item.id}}" > {{ item.id }} </a>
  <input type="checkbox" ng-model="selectedMessages[item.id]"/>
</li>

此处的问题是selectedMessages[item.id]仅已初始化，并且当复选框点击一次时设置。

这是必要的原因是我想用一个命令切换所有复选框，如下所示：

$scope.toggleCheckboxes = (state) ->
  for key, val of $scope.selectedMessages
    $scope.selectedMessages[key] = state  # true or false

我们说我有3个复选框，点击1次，2次，2次，3次从不，然后说对象将如下所示：

$scope.selectedMessages = {
    "1" : true,
    "2" : false
  }

很明显，$scope.toggleCheckboxes(true)仅适用于这些复选框。

有多种方法可以为多个复选框初始化此ng模型吗？

Answer 1

您可以使用ng-init填充数组。我使用$index而不是使用id属性构成一堆数据...相应地调整代码

<input type="checkbox" 
     ng-model="selectedMessages[$index]"
     ng-init="selectedMessages[$index]=selectedMessages[$index]||false" />

JS

  $scope.selectedMessages=[];
  $scope.checkAll=function(){
    var msgs = $scope.selectedMessages
    msgs.forEach(function(elem, idx){
      msgs[idx] =true
    })
  }

的 DEMO

如何在ng-repeat循环中初始化输入复选框的ng模型

1 个答案: