我想通过在达到最大值后禁用剩余记录来将列表中可能选择的记录数限制为总记录的子集。该列表的长度可能是 1000 条记录,因此性能是一个问题。我担心我目前的解决方案(下面/小提琴)不会扩展。出于性能原因,我已经阅读了几篇警告不要在ng-repeat中使用函数(在本例中为maxSelected() )的文章,但不确定没有它们我该如何完成?任何建议将不胜感激!
这是小提琴...... http://jsfiddle.net/ALPEP/
HTML:
<div ng-controller="recordsCollectionController">
<table>
<tbody>
<tr
ng-repeat="record in records"
ng-class="{info:selected[record.id], warning:!selected[record.id] && maxSelected()}">
<td>
<input
type="checkbox"
ng-model="selected[record.id]"
ng-disabled="!selected[record.id] && maxSelected()"
id="{{record.id}}"/>
</td>
<td>
<label for="{{record.id}}">{{record.name}}</label>
</td>
</tr>
</tbody>
</table>
</div>
JS:
angular
.module('App',[])
.controller('recordsCollectionController',function($scope){
$scope.selected = {"1":true,"2":true,"3":true};
$scope.records = [
{"id":1,"name":"Homer"},
{"id":2,"name":"Marge"},
{"id":3,"name":"Bart"},
{"id":4,"name":"Lisa"},
{"id":5,"name":"Maggie"}
];
$scope.maxSelected = function(){
var count = 0;
for(x in $scope.selected){
if($scope.selected[x]) count++;
}
return (count===3) ? true : false;
};
});