Question

我有一系列用

显示的项目

<tr ng-repeat="i in items | filter:search_text" ...>

项目有一个表示“已选择”的复选框。当我需要执行诸如调用删除所有选定项目的删除功能之类的操作时，如何知道过滤器显示哪些项目？

仍然选择已选中（在复选框中选中）然后通过过滤隐藏的项目。我现在需要一种方法来了解屏幕上的哪个项目。

Answer 1

您可以使用$ 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()。

Answer 2

不是真的超级抛光，但它有效。

在您的控制器中

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>

Angularjs过滤并选中所有复选框

2 个答案: