title: ng: 'mat-table' is not a known element
body: <p>I'm trying to use mat-table in an Angular 5 project but I've got this error.
  I imported the <code>MatTableModule</code> and everything necessary to it but still getting this error: </p>
  
  <blockquote>
    <p>ng: 'mat-table' is not a known element: 1. If 'mat-table' is an
    Angular component, then verify that it is part of this module. 2. If
    'mat-table' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to
    the '@NgModule.schemas' of this component to suppress this message.</p>
  </blockquote>
  
  <p>This is my admin.module.ts which is the parent module of my component: </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import { AdminRoutingModule } from './admin-routing/admin-routing.module';
  import { AdminControlSidebarComponent } from './admin-control-sidebar/admin-control-sidebar.component';
  import { AdminFooterComponent } from './admin-footer/admin-footer.component';
  import { AdminContentComponent } from './admin-content/admin-content.component';
  import { AdminLeftSideComponent } from './admin-left-side/admin-left-side.component';
  import { AdminHeaderComponent } from './admin-header/admin-header.component';
  import { AdminComponent } from './admin.component';
  import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';
  import { JobOfferComponent } from './Component/job-offer/job-offer.component';
  import {HttpClientModule} from '@angular/common/http';
  import {NgxSmartModalModule} from 'ngx-smart-modal';
  import {FormsModule, ReactiveFormsModule} from '@angular/forms';
  import {NotifierModule} from 'angular-notifier';
  import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
  import {OwlDateTimeModule, OwlNativeDateTimeModule} from 'ng-pick-datetime';
  import {FilterPipeModule} from 'ngx-filter-pipe';
  import {NgMultiSelectDropDownModule} from 'ng-multiselect-dropdown';
  import { ApplicationPipe } from './pipes/application.pipe';
  import {MatTabsModule} from '@angular/material';
  import {TabModule} from 'angular-tabs-component';
  import { AngularMultiSelectModule } from 'angular2-multiselect-dropdown';
  import { ApplicationBackComponent } from './Component/job-offer/application-back/application-back.component';
  import { JobOfferDetailsComponent } from './Component/job-offer/application-back/job-offer-details/job-offer-details.component';
  import { TestComponent } from './Component/job-offer/application-back/test/test.component';
  import { InterviewsComponent } from './Component/job-offer/application-back/interviews/interviews.component';
  import { RequestComponent } from './Component/request/request.component';
  import { DashboardComponent } from './Component/dashboard/dashboard.component';
  import { ClientComponent } from './Component/client/client.component';
  import { ProjectComponent } from './Component/project/project.component';
  import { ResourcesComponent } from './Component/resources/resources.component';
  import { MandatsComponent } from './Component/mandats/mandats.component';
  import { SupportComponent } from './Component/support/support.component';
  import { MatInputModule, MatPaginatorModule, MatProgressSpinnerModule,
    MatSortModule, MatTableModule } from '@angular/material';
  @NgModule({
    imports: [
      CommonModule,
      AdminRoutingModule,
      HttpClientModule,
      NgxSmartModalModule.forRoot(),
      FormsModule,
      ReactiveFormsModule,
      AngularMultiSelectModule,
      NgMultiSelectDropDownModule.forRoot(),
      NotifierModule,
      FilterPipeModule,
      MatTabsModule,
      BrowserAnimationsModule,
      OwlDateTimeModule,
      OwlNativeDateTimeModule,
      MatInputModule,
      MatPaginatorModule,
      MatProgressSpinnerModule,
      MatSortModule,
      MatTableModule],
    declarations: [
      AdminHeaderComponent,
      AdminLeftSideComponent,
      AdminContentComponent,
      AdminFooterComponent,
      AdminControlSidebarComponent,
      AdminComponent,
      JobOfferComponent,
      ApplicationBackComponent,
      JobOfferDetailsComponent,
      TestComponent,
      ApplicationPipe,
      InterviewsComponent,
      RequestComponent,
      DashboardComponent,
      ClientComponent,
      ProjectComponent,
      ResourcesComponent,
      MandatsComponent,
      SupportComponent
    ],
    exports: [
      AdminComponent,
      MatTabsModule,
      BrowserAnimationsModule,
      OwlDateTimeModule,
      OwlNativeDateTimeModule,
      MatInputModule,
      MatPaginatorModule,
      MatProgressSpinnerModule,
      MatSortModule,
      MatTableModule]
  })
  export class AdminModule { }</code></pre>
  </div>
  </div>
  
  and this is my component: </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import { Component, OnInit } from '@angular/core';
  import { RequestService } from '../../services/request.service';
  import { HttpClient } from '@angular/common/http';
  import {Request} from '../../models/Request';
  
  import {Observable} from 'rxjs/Observable';
  import 'rxjs/add/operator/map';
  import * as $ from 'jquery';
  import { MatInputModule, MatPaginatorModule, MatProgressSpinnerModule,
    MatSortModule, MatTableModule } from '@angular/material';
  import {MatTableDataSource} from '@angular/material';
  
  @Component({
    selector: 'app-request',
    templateUrl: './request.component.html',
    styleUrls: ['./request.component.css'],
    providers : [RequestService]
  })
  export class RequestComponent implements OnInit {
    listRequests: Request[] = [];
    listData: MatTableDataSource&lt;any&gt;;
    columns: string[] = ['id', 'Project', 'Resource Type', 'Delivery Date', 'Status'];
    constructor(private httpClient: HttpClient) {}
  
    getAllRequests() {
      return this.httpClient.get&lt;Request[]&gt;('/map-web/map/User/getAllRequests').subscribe(data =&gt; {
        const res = data;
        for (let i = 0; i &lt; res.length; i++) {
          this.listRequests.push(res[i]);
        }
        this.listData = new MatTableDataSource(this.listRequests);
      });
    }
    ngOnInit() {
      this.getAllRequests();
    }
  
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>Any help please to solve this problem, it's an emergency </p>