整合mat-table与observable和HTTP请求

Question

嗨，我只想显示在mat-table的HTTP请求的结果。

我不想知道为什么我不能展示。

我的组件：

    displayedColumns: string[] = ['id'];
dataSource = new MatTableDataSource<User>();

constructor(private httpService: HttpService) {
  this.httpService.accounts.subscribe(users => { this.dataSource.data = users; });
}

ngOnInit() {
}

我的html：

<mat-table>
<ng-container matColumnDef="id">
<mat-header-cell *matHeaderCellDef>id</mat-header-cell>
<mat-cell *matCellDef="let user">{{user.id}}</mat-cell>>
</ng-container>

<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>

当我使用console.log时，我有属性id的所有用户。

Answer 1

我认为每当数据源发生变化时，都需要调用_updateChangeSubscription()来更新视图。MatTable不会隐式接受更改。

displayedColumns: string[] = ['id'];
dataSource = new MatTableDataSource<User>();

constructor(private httpService: HttpService) {
  this.httpService.accounts.subscribe(users => {
    this.dataSource.data = users;
    this.dataSource._updateChangeSubscription();
  });
}