Ag Grid и асинхронный канал вызывают проблемы с загрузкой оверлея

Question

Нагрузка накладывается нормально на начальную загрузку.

HTML

  <ag-grid-angular #agGrid style="width: 100%; height: 550px;" 
    class="ag-theme-balham" [gridOptions]="gridOptions" 
    [rowData]="filteredTasks$ | async" 
    (selectionChanged)="onSelectionChanged()" 
    (rowClicked)="onRowClicked($event)">
  </ag-grid-angular>

Component.ts

    filteredTasks$: Observable<TaskListDto[]>;

    this.filteredTask$ = this.taskService.getFilteredTasks(httpParams);

У меня есть фильтр, который пользователь выбирает, который идетв базу данных с новыми httpParams и возвращает данные, запрашиваемые пользователем.Я даже не могу заставить оверлей загрузки.По какой-то причине установка на наблюдаемое просто заставляет сетку отображать «No Row to Show»

Что-то перекрывает мой оверлей, даже когда я заставляю api отображать то, что я хочу.Ниже приведен код, который я использовал, чтобы выяснить, что что-то вынуждает «без строк отображать»

    1st debugger;
    this.gridApi.setRowData([]);
    2nd debugger;
    this.filteredTasks$ = this.taskService.getFilteredTasks(httpParams);
    3rd debugger;
    this.gridOptions.api.hideOverlay();
    4th debugger;
    this.gridOptions.api.showLoadingOverlay();
    5th debugger;

Первые попадания отладчика и предыдущие данные отображаются

Вторые попадания отладчика и сетка agпусто и строки не отображаются

Третий отладчик обращений и строки не отображаются (хотя источник данных теперь установлен на наблюдаемый с помощью асинхронного канала)

Четвертый отладчик обращений и без наложения ввсе отображается

Пятый удар по отладчику и, наконец, отображается «Загрузка», но он мгновенно заменяется «Нет строк для отображения»

Что происходит?Что я здесь не так делаю?

Answer 1

Показывается пятый отладчик и, наконец, отображается «Загрузка», но он мгновенно заменяется «Нет отображаемых строк» ​​

Ваш поток отладки правильный, отображается «Нет отображаемых строк»Потому что на этом шаге loadNewData rows$ получил привязку нового наблюдателя, но не должен.

Как только вы установили данные (на этапе инициализации) - это сделано послечто - все манипуляции с сеткой должны обрабатываться через gridApi

в вашем случае, loadNewData должно быть сделано так:

loadNewData() {
    this.showOverlay();
    let request = of(this.rowData2).pipe(
      delay(5000)
    )
    request.subscribe(result=>{
      this.hideOverlay();
      this.gridOptions.api.setRowData(result)
    })
}