MatSort не работает. Выдает ошибку: MatSortHeader должен быть помещен в родительский элемент с помощью директивы MatSort

Question

После того, как я укажу атрибут mat-sort-header в matHeaderCellDef для создания таблицы Sortable в Angular Material, получим следующую ошибку

MatSortHeader должен быть помещен в родительский элемент с директивой MatSort.

<mat-table #table matSort [dataSource]="myHttpDataSource">
....
<ng-container matColumnDef="myColumnName">
<mat-header-cell *matHeaderCellDef mat-sort-header></mat-header-cell>
<mat-cell *matCellDef="let row"> {{row.somedetails}} </mat-cell>
</ng-container>
</mat-table>

Любые указатели / помощь приветствуется

Answer 1

<mat-table mat-table [dataSource]="dataSource" matSort>

    <ng-container matColumnDef="name">
      <th mat-header-cell *matHeaderCellDef mat-sort-header> Name </th>
      <td mat-cell *matCellDef="let element"> {{element.name}} </td>
    </ng-container>

To add sorting behavior to the table, add the matSort directive to the 
table and add mat-sort-header to each column header cell that should 
trigger sorting.

Answer 2

Не могли бы вы дать нам больше информации, пожалуйста?

Вы пытались поймать событие?

<mat-table #table [dataSource]="dataSource" matSort (matSortChange)="sortData($event)">

Answer 3

Понял, что я использовал старый тег mdSort в другой таблице mat, который вызывал эту проблему.После перехода на matSort проблема была решена.

Answer 4

Добавить атрибут 'matSort' в таблицу mat

<mat-table #table [dataSource]="dataSource" matSort>
</mat-table>