Установить фильтр AG перед отображением строк

#angular #ag-grid

#angular #ag-сетка

Вопрос:

Я использую сетку AG для отображения данных на стороне клиента. Есть несколько предустановленных фильтров, которые мне нужно применить перед отображением каких-либо данных. Я делаю это, вызывая setFilterModel gridApi в gridReady событии, но уже слишком поздно. Данные уже были отображены в этот момент, поэтому я получаю краткое отображение всех данных перед применением фильтра, а затем строки снова удаляются.

 onGridReady(params) {
    this.gridOptions.api.sizeColumnsToFit();
    params.api.setFilterModel(this.filterModel);
}

Есть ли событие, которое я могу использовать, или способ доступа к grid API для установки модели фильтра перед отображением каких-либо данных?

Я создал демонстрационную версию Stackblitz, показывающую проблему. Демонстрация показывает только короткое мерцание, но обновление данных с помощью пользовательских средств визуализации, большего количества столбцов и т. Д. Занимает больше времени.

https://stackblitz.com/edit/ag-grid-set-initial-filter-state-so-64426323?file=src/app/app.component.ts

Спасибо,

1. Пожалуйста, не могли бы вы предоставить stackblitz (или аналогичный), чтобы продемонстрировать проблему?

2. Привет, @Fletch, я добавил Stackblitz.

3. есть ли какие-либо конкретные требования, которые вы устанавливаете для данных строк onInit , а не для gridReady них?

4. Только для имитации наличия большого количества данных перед загрузкой сетки. В реальном приложении именно родительский элемент генерирует данные строки и передает их компоненту, используя @Input , но результат тот же.

Ответ №1:

Используйте метод onFirstDataRendered():

 <ag-grid-angular
  (gridReady)="onGridReady($event)"
  (firstDataRendered)="onFirstDataRendered()">
</ag-grid-angular>

private gridApi;
private gridColumnApi;

onGridReady(params: AgGridEvent) {
    this.gridApi = params.api;
    this.gridColumnApi = params.columnApi;
}

onFirstDataRendered() {
    this.gridApi.setFilterModel(this.filterModel);
}