时间戳

首页 > 解决方案 > Ag-grid 保存/恢复过滤器状态不起作用

angular - Ag-grid 保存/恢复过滤器状态不起作用

问题描述

我一直在我的应用程序中使用 Ag-grid，我正在尝试保存和恢复表格过滤器。（我没有使用 Ag-Grid 的企业版）。

我找到了这个链接，它说明了如何保存/恢复过滤器

我正在尝试存储过滤器状态，然后点击更新表的 URL，然后恢复过滤器

这是我保存和恢复过滤器状态的代码

 saveState() {
         window.colState = this.tableOptions.columnApi.getColumnState();
         window.groupState = this.tableOptions.columnApi.getColumnGroupState();
         window.sortState = this.tableOptions.api.getSortModel();
         window.filterState = this.tableOptions.api.getFilterModel();
    }

 restoreState() {
         this.tableOptions.columnApi.setColumnState(window.colState);
         this.tableOptions.columnApi.setColumnGroupState(window.groupState);
         this.tableOptions.api.setSortModel(window.sortState);
         this.tableOptions.api.setFilterModel(window.filterState);
  }

但是，刷新表数据后，我无法恢复到保存状态。我试着打电话onFilterChanged()给我似乎没有做这项工作。

我的代码看起来像这样

需要帮忙。谢谢

标签： angularag-grid

解决方案

根据您的样本：

saveState() {
    window.colState = this.gridColumnApi.getColumnState();
    window.groupState = this.gridColumnApi.getColumnGroupState();
    window.sortState = this.gridApi.getSortModel();
    window.filterState = this.gridApi.getFilterModel();
    this.http
      .get(
        "https://raw.githubusercontent.com/ag-grid/ag-grid/master/packages/ag-grid-docs/src/olympicWinnersSmall.json"
      )
      .subscribe(data => {
        this.rowData = data;
        //... restore the state here ...
        setTimeout(()=>{
            this.restoreState();
        }, 100)
      });
}

你可以问为什么ag-grid如果改变了，为什么不保持当前状态rowData。

它发生了，因为您没有更新现有数据，您只是替换当前数据。

从描述

setRowData(newRowData)等于rowData = newRowData

setRowData(rows)将新行设置到网格中。

要实现更新操作的状态保存，您应该使用updateRowData方法

推荐阅读