Question

我有一个表，仅在this.rowData完全填满（因此将提取所有数据）时才显示。问题是我像这样用两个http调用填充了它：

ngOnInit() {
    this.getTasks(this.item.availableTasks$); // This are the first data I want to fetch
    this.getTasks(this.item.myTasks$); // This are the second data I want to fetch (now this.rowData have all the datas I need)

  }

  getTasks(taskType): void {
    // taskType is a replaySubject that returns an Observable
    taskType.subscribe( 
      (tasksObservable: Observable<any>) => {
        tasksObservable.subscribe(
          (tasks: any) => {
            for (const task of tasks) {
              this.rowData.push(task ); // This is where i push datas into my array
            }
          }
        );
      }
    );
  }

在这里，我两次调用getTasks来填充我的rowData数组。当控制台登录ngOnInit中的rowData时，它将正确显示我的所有数据。但是我看到的结果只是我第一次通话中的数据。

这是桌子：

<ag-grid-angular
    *ngIf="rowData.length != 0"
    class="col-12"
    style="height: 500px;" 
    [enableSorting]="true"
    [enableFilter]="true"
    [enableColResize]="true"
    [pagination]="true"
    [paginationPageSize]="15"
    [rowSelection]="rowSelection"
    (gridReady)="onGridReady($event)"
    class="ag-theme-balham"
    [rowData]="rowData" 
    [columnDefs]="columnDefs"
    [defaultColDef]="defaultColDef"
    >
</ag-grid-angular>

在显示表格之前，如何等待两个呼叫结束？额外的问题：我的getTasks方法有点麻烦，因为有双重订阅，该如何清理呢？

谢谢！

Answer 1

请注意Angular 2+中的不变性，请参见https://angular-2-training-book.rangle.io/handout/immutable/what_is_immutability.html。

您应使用以下命令将新项目推送到this.rowData：

this.rowData = [
  ...this.rowData,
  task
];

this.rowData.push()方法不遵守不变性模式。

提取所有数据后显示表（ag网格）

1 个答案: