更新 ag-grid 中的行数据时列过滤器丢失

Question

我正在尝试在 ag-grid 中预配置一个列过滤器，一个简单的文本 "equals" 过滤器，仅显示与某些指定文本匹配的行，我成功了。

然而，一旦我用一组新的行替换模型数据，我的过滤器就会消失。

我已经尝试通过两种方式更新我的模型数据：

通过替换绑定 rowData 的值属性（我正在使用 Vue.js）
调用 api.setRowData(newRows)

这两种情况都会导致列过滤器丢失。

有没有办法在不丢失列过滤器的情况下更新模型数据？

Answer 1

在他们的documentation中说你可以设置gridOptions 属性 deltaRowDataMode=true，然后使用api.setRowData(newRows)。这会将当前行数据与新数据进行比较，以查看发生了什么变化并进行相应更新。如果没有此属性设置，网格将删除所有设置以确保重新开始。

Answer 2

我有同样的问题，这是你可以在行数据更新后继续应用数据过滤器。

订阅 ag 网格的 rowDataChanged 事件。

(rowDataChanged)="onRowDataChanged($event)"

在 onRowDataChanged 中放置您的过滤逻辑

// Get a reference to the name filter instance
const filterInstance = this.gridApi.getFilterInstance('fieldNameHere');
// Call some methods on Set Filter API that don't apply the filter
filterInstance.setModel({
    type: 'contains', // type of filter
    filter: 'yourData' // set filter on data
});
// Get grid to run filter operation again
this.gridApi.onFilterChanged();

onRowDataChanged 将被触发两次，第一次是在网格清除所有内容时，第二次是在重新加载数据时。所以，你应该设置一些条件来避免任何错误。

例如，我需要根据刷新后加载的数据设置过滤器，这就是我所做的：

const filtered = this.rowData.filter(x => x.Id === this.Id);
if (filtered.length > 0) {
    // Get a reference to the name filter instance
    const filterInstance = this.gridApi.getFilterInstance('fieldNameHere');
    // Call some methods on Set Filter API that don't apply the filter
    filterInstance.setModel({
        type: 'contains', // type of filter
        filter: filtered[0].name // set filter on data
    });
    // Get grid to run filter operation again
    this.gridApi.onFilterChanged();
}

更新 ag-grid 中的行数据时列过滤器丢失

Column filter lost when updating row data in ag-grid

ag-grid