title: Still "Can't bind to 'dataSource' since it isn't a known property of 'table'."
body: <p>I've spent two days on all possible solutions found (see below), and upgraded both Angular and Material from 7 to 8, still the same complaint.</p>
  
  <blockquote>
    <p>can't bind to 'dataSource' since it isn't a known property of 'table'</p>
  </blockquote>
  
  <ol>
  <li><code>import</code> and <code>@NgModule</code> in both app.module.ts and component.ts
  (tried partial as well, all possible combination`)</li>
  <li>swap out <code>&lt;table</code> for <code>&lt;mat-table</code> </li>
  <li><code>[dataSource]</code> not <code>[datasource]</code></li>
  </ol>
  
  <p>app.module.ts</p>
  
  <pre><code>import { MatFormFieldModule, MatInputModule} from '@angular/material';
  import { MatTableModule } from '@angular/material/table';  // or just @angular/material
  @NgModule({
    imports:
    [
      MatTableModule // adding MatTableDataSource here will get Error at component.ts: Unexpected value 'MatTableDataSource' imported by the module 'AppModule'. Please add a @NgModule annotation
    ]})
  </code></pre>
  
  <p>component.ts</p>
  
  <pre><code>import {MatTableModule, MatTableDataSource} from '@angular/material/table';
  @NgModule({
      imports: [MatTableModule, MatTableDataSource]
    })
  </code></pre>
  
  <p>component.html</p>
  
  <pre><code>&lt;table mat-table [dataSource]="myArray"&gt;
          &lt;tr mat-row *matRowDef="let row"&gt;&lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>package.json, tried v8.0.1 for material as well:</p>
  
  <pre><code>"dependencies": {
      "@angular/animations": "^8.0.0",
      "@angular/cdk": "^8.0.1",
      "@angular/common": "^8.0.0",
      "@angular/compiler": "^8.0.0",
      "@angular/core": "^8.0.0",
      "@angular/flex-layout": "^8.0.0-beta.16",
      "@angular/forms": "^8.0.0",
      "@angular/http": "^7.2.8",
      "@angular/material": "^8.1.2",
      "@angular/platform-browser": "^8.0.0",
      "@angular/platform-browser-dynamic": "^8.0.0",
      "@angular/router": "^8.0.0",
      "core-js": "^2.5.4",
      "rxjs": "~6.3.3",
      "rxjs-compat": "~6.3.3",
      "tslib": "^1.9.0",
      "zone.js": "~0.8.26"
    },
  </code></pre>
  
  <p>Tried all these:
  <a href="https://stackoverflow.com/questions/53185437/angular7-cant-bind-to-datasource-since-it-isnt-a-known-property-of-mat-ta">Angular7 - Can&#39;t bind to &#39;dataSource&#39; since it isn&#39;t a known property of &#39;mat-table&#39;</a></p>
  
  <p><a href="https://stackoverflow.com/questions/51027376/error-cant-bind-to-datasource-since-it-isnt-a-known-property-of-mat-tree">ERROR: Can&#39;t bind to &#39;dataSource&#39; since it isn&#39;t a known property of &#39;mat-tree&#39;</a></p>
  
  <p><a href="https://stackoverflow.com/questions/50177086/material-design-table-is-not-accepting-datasource-object">Material Design Table is not accepting dataSource object</a></p>
  
  <p><a href="https://stackoverflow.com/questions/50298241/mat-table-cant-bind-datasource">mat-table can&#39;t bind dataSource</a></p>
  
  <p><a href="https://github.com/angular/components/issues/11906" rel="nofollow noreferrer">https://github.com/angular/components/issues/11906</a></p>
  
  <p><a href="https://www.devexpress.com/Support/Center/Question/Details/T730641/the-can-t-bind-to-datasource-since-it-isn-t-a-known-property-of-dx-data-grid-error-occurs" rel="nofollow noreferrer">https://www.devexpress.com/Support/Center/Question/Details/T730641/the-can-t-bind-to-datasource-since-it-isn-t-a-known-property-of-dx-data-grid-error-occurs</a></p>
  
  <p><a href="https://www.oipapio.com/question-941474" rel="nofollow noreferrer">https://www.oipapio.com/question-941474</a></p>
  
  <p><a href="https://code-examples.net/en/q/2fe6baa" rel="nofollow noreferrer">https://code-examples.net/en/q/2fe6baa</a></p>