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

и как бы это исправить?

Answer 1

Материал предоставил свою поддержку липким заголовкам, которые теоретически должны решить мою проблему, как только она выйдет: https://github.com/angular/material2/pull/11483

Answer 2

В своем коде вы назначаете экземпляр MatSort для вашего источника данных.Элемент sort будет первым экземпляром директивы MatSort, которую angular может найти в шаблоне.

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

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

Поскольку вы разделяете источник данных между двумя таблицами, используется только первая.

Вы не можете совместно использовать свой источник данных по таблицам, если хотите выполнять такие операции, как сортировка, фильтрация, ..

Решение состоит в том, чтобы иметь один источник данных на таблицу.