复选框无法与ng-repeat，AngularJs一起正常使用

Question

我想使用ng-repeat进行多选复选框。 如果我没有预选复选框，则工作正常。 但是，当我预选复选框时，它的行为是完全不寻常的。

<div ng-repeat="account in accounts">
    <input ng-model="selectedAccounts[account.id]"              
    ng-checked="{{account.lastchecked}}" type="checkbox">       
</div>

在控制器中，我选择的ID为：

$scope.selectedAccounts = [];
angular.forEach($scope.selectedAccounts, function(value, key) {
    if(value == true) {
        selectedIds.push(key);
    }
}); 

这里的问题是我必须用初始数组初始化selectedAccounts。 如果我不这样做，那么它将给我未定义的含义。 当我为某些帐户“ lastchecked”为true时，它会根据lastchecked显示预检查的值，但是当我尝试获取$ scope.selectedAccounts时，它将给我空数组。 但是当我手动选中/取消选中每个选项时，$ scope.selectedAccounts给我正确的结果。

Answer 1

这是我要怎么做：

$scope.context = {accounts : :[]};// init is important to place the variable in that scope on not in a child
<div ng-repeat="account in context.accounts">
    <input ng-model="account.lastchecked" ng-checked="account.lastchecked"              
       ng-true-value="true" ng-false-value="false" type="checkbox">       
</div>

Ng-true-value和ng-false-value确保该值是布尔值true / false，而不是字符串。

获得选定的帐户后，您只需使用lastchecked==true .filter帐户

中间对象上下文是为了避免范围问题，范围继承在简单字段上失败。 这是javascript的限制。 在angularJS中，这称为DOT表示法。

Answer 2

经历这个

 var jimApp = angular.module("mainApp", []); jimApp.controller('mainCtrl', function($scope){ $scope.selectedAccounts = {"3":true}; $scope.accounts = [{id:1, name:"account1", checked: true}, {id:2, name:"account2"}, {id:3, name:"account3"}] }); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="mainApp" ng-controller="mainCtrl"> <div ng-repeat="account in accounts"> <input ng-model="selectedAccounts[account.id]" ng-checked="selectedAccounts[account.id]" type="checkbox">{{account.name}} </div> <div>{{selectedAccounts}}</div> </div>