angular - Angular：为什么排序只适用于第一个 Mat Table？

Question

为什么这里宣传的排序功能：https ://material.angular.io/components/table/overview#sorting

添加第二个表以显示数据的后半部分后立即失败？：

https://stackblitz.com/edit/angular-1vg9gn-q1back?file=app/table-basic-example.ts

我将如何解决它？

标签： angularsortingangular-material2

Answer 1

MatSort在您的代码中，您正在为您的数据源分配一个实例。该sort成员将是MatSortangular 可以在模板中找到的指令的第一个实例。

@ViewChild(MatSort) sort: MatSort; //1st sort directive

ngOnInit() {
  this.dataSource.sort = this.sort;
}

由于您在 2 个表之间共享数据源，因此只使用第一个表。

您无法跨表共享数据源，以执行排序、过滤等操作。

解决方案是每个表有一个数据源。