Angular 具有无限滚动功能的 ag-grid 上的动态主题更改

Dynamic theme change on Angular ag-grid with infinite scroll

我的 Angular 9 应用程序中有一个 Ag-grid,无限滚动正常工作,我想实现一个主题选择器,就像 demo.

中的那样

但是,仅更改 CSS class 不足以更改主题,因为主题更改时不会更新行高。

我尝试在更改主题后调用 refreshCellsresetRowHeights,但都没有更新行高。

演示的源代码似乎在主题更改时销毁并重新创建网格,this GitHub 问题似乎证实动态更改主题的最佳方法是销毁网格并重新创建它。

但是,在调用 gridApi.destroy() 之后,我一直无法找到重新创建网格的方法。

有办法吗?

我在 this plunkr 中找到了答案:

要销毁和重新创建网格,它需要位于具有 *ngIf 的容器元素中,以便可以动态地删除和重新创建它:例如,如果容器元素是

<div *ngIf="gridActive">
    <ag-grid ....>
</div>

然后在组件代码中可以通过以下方式更改主题:

recreateGrid() {
    this.gridActive = false;
    setTimeout(() => {
      this.gridActive = true;
    });
}