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发送到数据库，并返回用户请求的数据。我什至无法强制加载叠加层。由于某种原因，将其设置为可观察状态只是导致网格显示“无行可显示”

即使我强制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网格为空并且不显示任何行

第三次调试器命中，并且仍然没有显示行（即使数据源现在设置为使用异步管道可观察到的情况）

第四个调试器命中，并且完全不显示叠加层

第五个调试器命中，最后显示“ Loading”，但立即被“ No Rows to Show”取代。

这是怎么回事？我在这里做什么错了？

Answer 1

第五个调试器命中，最后显示“ Loading”，但立即被“ No Rows to Show”取代。

您的调试流程是正确的，在此步骤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)
    })
}

Ag Grid和异步管道导致加载重叠问题

1 个答案: