Angular Ag网格和异步管道导致加载覆盖问题

荷载叠加在初始荷载时适用

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>

第一个调试器命中，并显示以前的数据

第二个调试器命中，ag网格为空，不显示任何行

第三个调试器命中，但仍不显示任何行（即使数据源现在已通过异步管道设置为可观察）

第四个调试器命中，不显示任何覆盖

第五次调试器点击，最后显示“加载”，但立即被“无需显示行”替换

发生了什么事？我做错了什么

第五次调试器点击，最后显示“加载”，但立即被“无需显示行”替换

您的调试流程是正确的，因为在此步骤上显示了“无需显示的行”

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)
    })
}

---

你能为测试准备一个代码样本库吗？是的，今天下午我可以得到一个工作代码样本。@un.spike这说明了问题所在，所以这使得异步管道在第一种情况下非常无用，因为现在我不得不手动取消订阅第二组数据。

    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;

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