Question

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

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

在Controller中我选择了id为：

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

这里的问题是我必须使用初始数组初始化selectedAccounts。如果我不这样做，那么它会给我一些不确定的。当我有最后一次检查时＃39;对于某些帐户是真的，然后根据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而不是字符串。

获取selectedAccount之后，您只需使用lastchecked==true

搜索search.filter帐户

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

Answer 2

完成此

＆＃13;

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"}]
});

＆＃13;

<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>

＆＃13;

使用ng-repeat，AngularJs，复选框无法正常工作

2 个答案: