AngularJS:如何在选择指定数量后禁用复选框？

Question

我在循环中有复选框,如下所示:

 <li ng-repeat="item in items">
      <h2>  {{item.better}}</h2>
      <span>{{item.startTime}}</span>
      <b>   {{item.lengthTime}}</b>
      <input type="checkbox" checklist-model="item.winner" checklist-value="item">
 </li>

我想设置限制,以便用户只能选择最多50个复选框,而不能超过(列表中的总项目数,即100或200等).

我们如何使用角度js实现这一目标？

帮助将非常感激.

谢谢.

Answer 1

小提琴

$scope.checkChanged = function(item){
    if(item.winner) $scope.checked++;
    else $scope.checked--;
}

和

 <input type="checkbox" ng-model="item.winner" ng-change="checkChanged(item)" ng-disabled="checked==limit && !item.winner"/>

这会跟踪ng-change检查并在达到限制时禁用它们并且不选中复选框.

不使用$ watch因为可能有~200个复选框.

编辑:抱歉忘了点击小提琴上的更新,现在应该可以了.另请注意,限制设置为4 $scope.limit = 4;