AG-Grid：如何在无限行模型中使用自定义过滤器

Question

我正在使用 AG Grid Angular 并希望将 自定义过滤器 与 无限行模型 结合使用。

documentation of the custom filters没有提到无限行模型，所以不清楚两者是否兼容。我已经实现了文档中的“简单过滤器”示例并将其附加到我的网格，这是我观察到的：

自定义过滤器正确显示，点击单选按钮刷新网格。
但是，数据没有被修改，自定义过滤器的 doesFilterPass() 方法似乎从未被调用（这在无限行模型中没有意义）。
我的行模型的数据源的 getRows() 方法被调用，但是 params.filterModel 仍然是空的。

在我看来，这几乎可以工作，除了自定义过滤器需要：

告诉网格添加数据源可以处理的过滤器模型
或者直接告诉数据源应用过滤器（这似乎是可行的，因为过滤器可以通过 params.rowModel.datasource 访问数据源，但这似乎是 hack）

有没有正确的方法，我错过了？

Answer 1

如果您使用的是无限行模型，网格希望您自己处理数据过滤，并return getRows 回调中过滤的行，如此处记录：https://www.ag-grid.com/angular-grid/infinite-scrolling/#sorting--filtering

请参阅以下示例，其中显示了如何使用自定义筛选器组件筛选年龄列中的行：https://plnkr.co/edit/riKeOvcWdUwWioVs

在 getModel 回调中，您只需 return 一个值/对象，它将由网格作为 request.filterModel 在 getRows:

中传递

  getModel(): any {
    if (this.filterValue === 'all') {
      return null;
    } else {
      return {
        filter: this.filterValue,
        type: 'equals',
      };
    }
  }

然后在 getRows 里面我写了一些基本的功能来过滤数据：

          getRows: function (params) {
            console.log(
              'asking for ' + params.startRow + ' to ' + params.endRow
            );
            setTimeout(function () {
              var dataAfterFiltering = filterData(data, params.filterModel);
              var rowsThisPage = dataAfterFiltering.slice(
                params.startRow,
                params.endRow
              );
              var lastRow = -1;
              if (dataAfterFiltering.length <= params.endRow) {
                lastRow = dataAfterFiltering.length;
              }
              params.successCallback(rowsThisPage, lastRow);
            }, 500);
          },

AG-Grid：如何在无限行模型中使用自定义过滤器

AG-Grid: How to use custom filters with infinite row model

ag-grid

ag-grid-angular