Angular 5开发报错：Can't bind to 'dataSource' since it isn't a known property of 'table'

嘿，我刚入门Angular的时候也踩过这个一模一样的坑！这个错误本质上是Angular没认出你用的table是Angular Material的组件，反而把它当成了原生HTML表格标签，所以才识别不了dataSource这个属性。下面是你需要逐一检查的几个关键点：

• 必须导入MatTableModule到你的模块中
  Angular Material的每个组件都需要单独导入对应的模块，表格也不例外。打开你使用表格的组件所属的模块文件（比如app.module.ts或者你的功能模块），添加以下代码：

  import { MatTableModule } from '@angular/material/table';
  
  @NgModule({
    imports: [
      // 这里放你已经导入的其他模块，比如BrowserModule、CommonModule等
      MatTableModule // 一定要把这个加到imports数组里！
    ],
    declarations: [YourTableComponent] // 确保你的表格组件已经在这里声明了
  })
  export class YourModuleName { }
  

  很多新手容易漏掉这一步，这可是最常见的原因哦。

• 确保模板里的表格用了正确的Material选择器
  你有两种方式使用Angular Material的表格，选其中一种就行，别搞混了：

  1. 使用<mat-table>标签：

     <mat-table [dataSource]="yourDataSource">
       <!-- 这里写你的列定义，比如<mat-header-cell>、<mat-cell>等 -->
     </mat-table>
     

  2. 给原生<table>标签添加mat-table指令：

     <table mat-table [dataSource]="yourDataSource">
       <!-- 这里写你的列定义，比如<th mat-header-cell>、<td mat-cell>等 -->
     </table>
     

  如果你只写了<table>而没加mat-table属性，Angular就会把它当成普通的HTML表格，自然不认识dataSource属性啦。

• 检查组件是否在正确的模块中声明
  如果你的表格组件是某个子组件，一定要确保这个子组件已经在导入了MatTableModule的模块中声明了，不然组件还是无法使用Material表格的特性。

按照这几步检查下来，应该就能顺利解决这个错误了。如果还有问题，可以再仔细看看代码里有没有拼写错误，比如模块名、标签名写错之类的小问题~

内容的提问来源于stack exchange，提问作者Rahul Munjal