我如何做Angular ngFor迭代

Question

有人可以帮助我如何在模板中填充以下json数据。这是我的代码：

app.html

<div *ngFor="let item of dataSource">
  Key: <b>{{item.referenceID}}</b> and Value: <b>{{item.merchantID}}</b>
</div>

app.ts

dataSource: MatTableDataSource<MerchantFinanceElement>;

this.abstractRestService.get('finance').subscribe(
  (response: any) => {
    const merchantFinanceData: MerchantFinanceElement[] = response;
    this.dataSource = new MatTableDataSource(merchantFinanceData);
    this.dataSource.sort = this.sort;
    this.dataSource.paginator = this.paginator;
    console.log('this.dataSource', this.dataSource.data);
  },
  (error: any) => {
    console.log(error);
  }
);

Answer 1

只需添加filtredData

<div *ngFor="let item of dataSource.filtredData |async">
  Key: <b>{{item.referenceID}}</b> and Value: <b>{{item.merchantID}}</b>
</div>