Question

我在matHeaderCellDef上指定了 mat-sort-header 属性以在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

将'matSort'属性添加到mat-table

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

Answer 2

请给我们更多信息吗？

您尝试赶上活动吗？

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

Answer 3

<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 4

意识到我正在另一个垫表中使用旧的mdSort标记，这导致了此问题。更改为matSort后，问题得到解决。

MatSort无法正常工作。引发错误：必须使用MatSort指令将MatSortHeader放置在父元素中

4 个答案: