【发布时间】:2013-02-26 14:13:39
【问题描述】:
我有一组要显示的项目
<tr ng-repeat="i in items | filter:search_text" ...>
这些项目有一个复选框,表示“选中”与否。 当我需要执行诸如调用将删除所有选定项目的删除函数之类的操作时,如何知道过滤器显示了哪些项目?
已选择(在复选框中选中)然后通过过滤隐藏的项目仍会被选中。我需要一种方法来知道当前屏幕上显示的是哪个项目。
【问题讨论】:
标签: angularjs
我有一组要显示的项目
<tr ng-repeat="i in items | filter:search_text" ...>
这些项目有一个复选框,表示“选中”与否。 当我需要执行诸如调用将删除所有选定项目的删除函数之类的操作时,如何知道过滤器显示了哪些项目?
已选择(在复选框中选中)然后通过过滤隐藏的项目仍会被选中。我需要一种方法来知道当前屏幕上显示的是哪个项目。
【问题讨论】:
标签: angularjs
您可以使用 $filter 在控制器中调用过滤器。
app.controller('MyCtrl', function($scope, $filter){
var filter = $filter('filter');
$scope.items = [/* your items here */]
$scope.selectAllFilteredItems = function (){
var filtered = filter($scope.items, $scope.search_text);
angular.forEach(filtered, function(item) {
item.selected = true;
});
};
});
然后,您可以在 ng-click 或其他任何您需要的地方调用 selectAllFilteredItems()。
【讨论】:
不是真的超级抛光,但它的工作原理。
在你的控制器中
var filter = $filter('filter');
$scope.item_ids = [];
$scope.selectAllFilteredItems = function (){
var filtered = filter($scope.items, $scope.searchText);
angular.forEach(filtered, function(item, key) {
if($scope.item_ids.indexOf(item.id) == -1){
$scope.item_ids.push(item.id);
$scope.items[key].selected = true;
}else{
$scope.item_ids.splice($scope.item_ids.indexOf(item.id),1);
$scope.items[key].selected = false;
}
});
};
然后在表格中,您有一个复选框可以选择全部或取消选择全部。
<table class='table table-striped'>
<tr>
<th><input type="checkbox" ng-click="selectAllFilteredItems()"></th>
</tr>
<tr ng-repeat="item in items | filter:searchText">
<td><input type="checkbox" ng-model="item.selected"></td>
</tr>
</table>
【讨论】: