javascript - 如何在 Angular 中仅获取/检查表的可见行

Question

如何在几个过滤器之后只获取表中的可见行？
我有带分页的表格，可以对其进行一些过滤。
我只想使用 SelectAll Checkbox 选择可见的。
起初我只有一个过滤器，只是迭代了这个过滤器的结果。

  selectAllChange() {
        if (this.$scope.AllChange) {
          this.$scope.AllChange = true;
          this.$scope.count = this.langV.length;
        } else {
          this.$scope.AllChange = false;
          this.$scope.count = 0;
        }// get whether to set true/false
        var filtered = this.filter(this.langV, {
          Name: this.$scope.searchK,
        });// filter after Search
        angular.forEach(filtered, (item) => {
          item.Selected = this.$scope.AllChange;
          this.change(item);
        });//set all true/false
      }

现在，随着越来越多的过滤器的出现，我们将不胜感激 SelectAll“Visbile/Shown/Filtered”行等更合适的解决方案。

selectAllChange() {
       ...
//somehow all shown Rows over all pages after filtered
        angular.forEach(visibleRows, (item) => {
          item.Selected = this.$scope.AllChange;
          this.change(item);
        });
      }

我尝试将表别名作为 results

    <tr dir-paginate="v in $ctrl.langV | filter:{Name:searchK,value1:searchV}| filterByProd:selectedProduct|orderBy: sortType:sortReverse|itemsPerPage:10 as results">  
...  
    {{results}}

但它只给我实际页面的行，而不是整个表格。
是否有一种简单的方法可以在过滤后获取所有行？ 或者我有没有以某种方式组合我的 CustomeFilter -> | filterByProd:selectedProduct 与实现的 AngularFilters |filter:{Name:searchK,value1:searchV} 并在其中返回一个数组，其中包含要选择的过滤对象？

Answer 1

所以不用命名整个

<div ng-repeat="some in something | someFilter as results"></div>

您必须将其更改为:

<div ng-repeat="some in visibleItems = (something | someFilter)"></div>

然后您可以在您的 Controller 中使用 $scope.visibleItems，它将仅包含已通过您的 someFilter 的项目的特定子集。
这现在只能由 SelectAll 更改。 以我为例

  selectAllChange() {
        if (this.$scope.AllChange) {// my SelectAll Checkbox
          this.$scope.AllChange = true;
        } else {
          this.$scope.AllChange = false;
        }// get whether to check/uncheck
        angular.forEach(this.$scope.visibleItems, (item) => {
          item.Selected = this.$scope.AllChange;
          this.change(item); // set every visible to checked/unchecked
        });
      }

在那里找到了解决方案: AngularJS - "Select All" items that are currently visible