【问题标题】:Intercepting filter/sort/column "model" changes / transactions拦截过滤器/排序/列“模型”更改/事务
【发布时间】:2021-09-02 18:55:42
【问题描述】:

我想通过外部存储来控制网格的排序、过滤和列状态。理想情况下,我想拦截 filterChanged 和 sortChanged 事件,将它们发送到商店,然后让商店使用网格 API 以编程方式更新网格。

readonly GRID_CONFIG: GridOptions = {
    onSortChanged: (event: SortChangedEvent) => {
      // Tell store that the sort changed
      this.sortChanged.emit(this.grid.api.getSortModel());
    },
    onFilterChanged: (event: FilterChangedEvent) => {
      // Tell store that the filter changed
      this.filterChanged.emit(this.grid.api.getFilterModel());
    },
    onFilterModified: (event: FilterModifiedEvent) => {
      // This isn't useful because it only relates to the floating filters pre-apply...
    }
}

不幸的是,一旦调用了 onFilterChanged 和 onSortChanged 事件,网格就已经被更新了,所以来自 store 的更新是多余的。

最接近我想要的是isApplyServerSideTransaction,因为这个回调允许取消交易。

    isApplyServerSideTransaction: (params: IsApplyServerSideTransactionParams) => {
      // Emit model changes to the store so that the store can update the grid
      this.sortChanged.emit(this.grid.api.getSortModel());
      this.filterChanged.emit(this.grid.api.getFilterModel());

      // Do not update the grid (redundant)
      return false;
    }

但是,这仅支持服务器端行模型完整模式。在我的情况下,这个回调永远不会被触发,因为我使用的是部分模式。

是否有任何其他技巧可以在应用模型更改之前挂钩它们,或者这只是不支持?

更新:我特别试图拦截 UI 触发的对排序/过滤模型的更改。我知道这可以通过自定义过滤器(也许还有自定义标题?)来实现,但我更愿意利用 Ag-Grid 的内置 UI 而不是构建一个完整的自定义副本,只是为了拦截一个事件。

【问题讨论】:

    标签: ag-grid ag-grid-angular


    【解决方案1】:

    由于您使用的是服务器端行模型,因此只要 Grid 请求数据,即每当您过滤/排序/分组等时,就会触发 getRows 回调。因此,如果您想拦截返回给 Grid 的内容,您应该在 getRows 回调中进行。

    【讨论】:

    • 我的问题是 UI 触发的更改和 API 更改都会调用 getRows,此时无法区分两者。我希望拦截 UI 更改,只让 API 更改通过。所以也许这完全是一个不同的问题......
    猜你喜欢
    • 1970-01-01
    • 2014-06-16
    • 1970-01-01
    • 1970-01-01
    • 2011-04-24
    • 1970-01-01
    • 1970-01-01
    • 2012-02-15
    • 1970-01-01
    相关资源
    最近更新 更多