Angular Material 2 中的 md 表答案

【问题标题】：md-table in Angular Material 2Angular Material 2 中的 md 表
【发布时间】：2017-07-09 14:58:57
【问题描述】：

我正在使用Angular Material Table. 在 Html 代码中，有

<ng-container cdkColumnDef="userId">
  <md-header-cell *cdkHeaderCellDef> ID </md-header-cell>
  <md-cell *cdkCellDef="let row"> {{row.id}} </md-cell>
</ng-container>

我发现 cdkHeaderCellDef 和 cdkCellDef 来自CDK Table

我收到错误消息“无法绑定到 'cdkHeaderRowDef'，因为它不是 'md-header-row' 的已知属性。”

我该如何解决这个问题？

【问题讨论】：

请务必在您的imports (NgModule) 中添加MdTableModule。
@developer033 是的，我在自己之前添加了
能否提供完整的 html 用于表格定义？
@DavidGabrichidze 我只是从角材料表中复制粘贴整个 html、ts 和 css。

标签： angular angular-material2 angular-cdk

【解决方案1】：

cdkHeaderCellDef 和 cdkCellDef 是 @angular/cdk 库的一部分，并在 CdkTableModule 中导出。

将此模块包含在您应用的导入中

【讨论】：

太棒了，谢谢！

【解决方案2】：

 import { CdkTableModule } from '@angular/cdk';

将此添加到组件的顶部和 app.module.ts 的顶部然后在 app.module.ts 上将 CdkTableModule 添加到导入，如下所示。

@NgModule({
   declarations: [

],
imports: [
    CdkTableModule

],
providers: [

],
bootstrap: [AppComponent],
})

可能有声明和提供者，但在上面的 sn-p 中，为方便起见，它们被忽略了。

【讨论】：

需要导入 { CdkTableModule } from '@angular/cdk/table';