缺少页眉、页脚和行的定义；无法确定应呈现哪些列 - Angular Material Table [英] Missing definitions for header, footer, and row; cannot determine which columns should be rendered - Angular Material Table

问题描述

我正在使用 Angular 9.0.4 和 @angular/material 9.1.3，我想显示一个基本的材料表:

I'm using Angular 9.0.4 with @angular/material 9.1.3 and I want to show a basic material table:

<table mat-table [dataSource]="devizas" class="mat-elevation-z8">
  <!-- name -->
  <ng-container matColumnDef="name">
    <th mat-header-cell *matHeaderCellDef>Name</th>
    <td mat-cell *matCellDef="let element"> {{ element.name }} </td>
  </ng-container>

  <!-- code -->
  <ng-container matColumnDef="code">
    <th mat-header-cell *matHeaderCellDef>Code</th>
    <td mat-cell *matCellDef="let element"> {{ element.code }} </td>
  </ng-container>
</table>

我在 app.module.ts 中导入了这个:

I imported in my app.module.ts this:

import { MatTableModule } from '@angular/material/table';

@NgModule({
  imports: [
    MatTableModule,
  ],
})

在我的 component.ts 中:

In my component.ts:

export class DevizaListComponent implements OnInit {
  devizas: DevizaInterface[] = [
    {
      name: 'dollar',
      code: 'USD' ,
    }
  ];

  constructor() { }

  ngOnInit() { }
}

现在我在浏览器中收到此错误消息:

Now I get this error message in the browser:

错误:缺少页眉、页脚和行的定义；无法确定应呈现哪些列.在 getTableMissingRowDefsError (table.js:996)在 MatTable.push../node_modules/@angular/cdk/ivy_ngcc/fesm5/table.js.CdkTable.ngAfterContentChecked (table.js:1296)

Error: Missing definitions for header, footer, and row; cannot determine which columns should be rendered. at getTableMissingRowDefsError (table.js:996) at MatTable.push../node_modules/@angular/cdk/ivy_ngcc/fesm5/table.js.CdkTable.ngAfterContentChecked (table.js:1296)

官方文档没有说明任何相关内容.有什么想法吗?

The official documentation says nothing relevant. Any idea?

推荐答案

试试这个！

<table mat-table [dataSource]="devizas" class="mat-elevation-z8">
 ....

  <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
  <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>

这篇关于缺少页眉、页脚和行的定义；无法确定应呈现哪些列 - Angular Material Table的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！