ag-grid - 拦截过滤器/排序/列“模型”更改/事务
问题描述
我想通过外部存储来控制网格的排序、过滤和列状态。理想情况下,我想拦截 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 事件,网格就已经更新了,因此来自存储的更新是多余的。
最接近我想要的是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 而不是构建一个完整的自定义副本,只是为了拦截一个事件。
解决方案
由于您使用的是服务器端行模型,因此只要 Grid 请求数据,即每当您过滤/排序/分组等时,就会触发 getRows 回调。因此,如果您想拦截返回给 Grid 的内容,您应该这样做在 getRows 回调中。
推荐阅读
- r - 将均值比较添加到绘图 + 是否可以在 KS 测试中显示 ggplot(或一般的 R)中的 p 值,特别是在小提琴图上?
- angular - 不确定如何在@ngrx/data 中“加入”
- javascript - Javascript过滤器试图避免多个if语句
- laravel - 将所需数据导入 VueJS 组件的最佳实践是什么?
- python - 如何使用相同的装饰器制作 2 个 on_member 工作事件?
- javascript - 为什么我的 ag-grid 标头 excelStyles 不起作用?
- r - 在R中的列表中提取列表中的数据(列表中的子集列表)
- react-native - react native(expo)中如何做动态图片源?
- java - 如何找到第二个重复次数最多的整数 - java
- python - 调用 tkinter.messagebox.showwarning() 后未调用条目 validatecommand