Ag grid Ag网格恢复数据

我正在使用ag grid加载数据。加载数据后，我希望保存ag grid的状态并将其还原以备将来使用。查阅文档后，我了解到我应该使用columnApi来保存状态。要在还原状态的同时加载数据，我应该做哪些更改，以及在哪里调用恢复状态，而不是有一个单独的按钮

var gridOptions = {
  columnDefs: columnDefs,
  enableSorting: true,
  enableFilter: true,
  onGridReady: function () {
      gridOptions.columnApi.setColumnState(colState);
  },
};

---

比如说，您有一个名为

GridParentComponent

的组件，其中有

ag网格

，为了便于理解，我们假设我们只是对到目前为止网格的

columnState

感兴趣

要实现这一点，您必须遵循以下步骤

获取网格从DOM卸载之前的状态。使用 这里

• 实现接口

  OnDestroy

  ，并在

  ngondstroy

  函数中，使用的

  getColumnState（）

• 将此数据存储在angular service中，并在用户再次出现在同一屏幕上时使用
• 如果您还希望在浏览器关闭后仍保持网格状态，则可以使用

  localStorage

  或API（如）来存储数据

设置网格加载到DOM中时的状态

• 在

  onGridReady

  事件中，从缓存中获取

  columnState

  数据，最好从从从内存或

  localStorage返回数据的单例服务中获取

• 使用

  gridApi.setColumnState（columnState）

  ，设置

  columnState

如果要通过应用程序在多个位置使用此功能，我建议您使用包装器组件并将执行这些操作的逻辑分离到该组件中，而不是将此逻辑保留在

GridParentComponent

中