Динамическое изменение темы на Angular ag-grid с бесконечной прокруткой

У меня есть Ag-сетка в моем приложении Angular 9 с бесконечной прокруткой, работающей правильно, и я хочу реализовать средство выбора темы, подобное тому, что в демо.

Однако простого изменения класса CSS недостаточно для изменения темы, потому что высота строк не обновляется при изменении темы.

Я попытался вызвать refreshCells и resetRowHeights после изменения темы, но ни один из них не обновил высоту строк.

Исходный код демонстрации, кажется, разрушает и воссоздает сетку при изменении темы, и эта проблема GitHub, похоже, подтверждает, что лучший способ динамически изменить тему - это уничтожить сетку и воссоздать ее.

Однако мне не удалось найти способ воссоздать сетку после вызова gridApi.destroy().

Как это сделать?


angular ag-grid ag-grid-angular
person Raibaz    schedule 12.10.2020    source источник

Ответы (1)


arrow_upward
-1
arrow_downward

Я нашел себе ответ в этом plunkr:

Чтобы уничтожить и воссоздать сетку, она должна находиться в элементе контейнера с *ngIf, чтобы его можно было удалить и воссоздать динамически: например, если элемент контейнера

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

Затем в коде компонента изменить тему можно, выполнив:

recreateGrid() {
    this.gridActive = false;
    setTimeout(() => {
      this.gridActive = true;
    });
}
person Raibaz    schedule 21.10.2020