Question

我在使用mat-table和排序数据时遇到问题，我找不到错误。

有一个stackblitz示例

https://stackblitz.com/edit/angular-lzhpvx

有人可以帮我看错吗？

Answer 1

你的错误是你的列模板和行模板键是大写的

displayedColumns = ['EMAIL','ID'];
                     ^^^^^^^^^^^^^
<ng-container matColumnDef="EMAIL">
                            ^^^^^^

而在您的数据中，数组键是小写的

const ELEMENT_DATA: TestEmail[] = [
  {email: 'test1@test.com', id:4},
  {email: 'aaaatest2@test.com', id: 7},
  {email: 'oootest3@test.com', id: 1}
];

为此分配了具有该列名称的字符串 matColumnDef指令。该指令唯一标识给定的带有键的列，它应该与数据数组中定义的相同为表提供数据。

<强>修饰：

  displayedColumns = ['email','id'];

  <ng-container matColumnDef="email">
  <ng-container matColumnDef="id">

<强> LIVE DEMO
P.S。您提供的 STACKBLITZ 使用最新版本的Angular Material V6并将其与材料V5混合

matSort没有正常工作

1 个答案: