AG-Grid：如何使用具有无限行模型的自定义过滤器答案

【问题标题】：AG-Grid: How to use custom filters with infinite row modelAG-Grid：如何使用具有无限行模型的自定义过滤器
【发布时间】：2021-09-13 16:17:16
【问题描述】：

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

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

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

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

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

有没有合适的方法来做到这一点，我错过了？

【问题讨论】：

标签： ag-grid ag-grid-angular

【解决方案1】：

如果您使用无限行模型，则网格希望您自己处理数据过滤并在getRows 回调中返回过滤后的行，如下所述：https://www.ag-grid.com/angular-grid/infinite-scrolling/#sorting--filtering

请参阅以下示例，该示例向您展示如何使用自定义过滤器组件来过滤年龄列上的行：https://plnkr.co/edit/riKeOvcWdUwWioVs

在getModel 回调中，您只需返回一个值/对象，该值/对象将作为request.filterModel 在getRows 中的request.filterModel 传递：

  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);
          },

【讨论】：