title: Unexpected value 'MatTableDataSource' imported by the module 'AppModule'. Please add a @NgModule annotation
body: <p>I am developing an angular application using angular 5. I wanted to use "MatTableDataSource" from angular- material. But i am getting this error </p>
  
  <p>Unexpected value 'MatTableDataSource' imported by the module 'AppModule'. Please add a @NgModule annotation.</p>
  
  <p>I search for a solution for this problem. I found this solution in git</p>
  
  <p>"<a href="https://github.com/angular/material/issues/10981" rel="nofollow noreferrer">https://github.com/angular/material/issues/10981</a>"</p>
  
  <p>There a user named @dliebel gave a solution. I applied it but getting this error again and again. app.module.ts is specified below</p>
  
  <pre><code>import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  import { HttpModule } from '@angular/http';
  import { ReactiveFormsModule, FormsModule, FormArray } from '@angular/forms';
  import { HttpClientModule } from '@angular/common/http';
  import { AppComponent } from './app.component';
  import { SellDetailFormComponent } from './sellDetail/sellDetailForm.component';
  import { RouterModule, Routes } from '@angular/router';
  import { HotTableModule } from '@handsontable/angular';
  import { CommonModule } from '@angular/common';
  import { MatTableModule, MatSortModule,MatTableDataSource } from '@angular/material';
  import { SellTableComponent } from './sellDetail/sellTable.component';
  
  
  const appRoutes: Routes = [
  { path: 'sellTable', component: SellTableComponent }
  
  
  ];
  
  @NgModule({
  declarations: [
    AppComponent,SellTableComponent
   ],
  imports: [
  BrowserModule, HttpModule, FormsModule,
  RouterModule.forRoot(appRoutes), ReactiveFormsModule,HotTableModule.forRoot() ,
   HttpClientModule, HotTableModule, 
  CommonModule,MatTableModule,MatSortModule,MatTableDataSource
  ],
  bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>