'mat-card' is not a known element in Angular 7 : <p>I've seen a lot of questions on this but doesn't seem to be the same issue Im encountering. I have just created my 2nd angular project. I have a new component under <code>src/app/employees</code> where I am trying to use  in employees.component.html . The error I am getting is:</p>

<pre><code>Uncaught Error: Template parse errors:
'mat-card' is not a known element:
1. If 'mat-card' is an Angular component, then verify that it is part of this module.
2. If 'mat-card' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("[ERROR -&gt;]&lt;mat-card&gt; &lt;/mat-card&gt;
</code></pre>

<p>Now, in app.module.ts I have:</p>

<pre><code>import { BrowserModule } from "@angular/platform-browser";
import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
import { LOCALE_ID, NgModule } from "@angular/core";
import { HttpClientModule, HTTP_INTERCEPTORS } from "@angular/common/http";
import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";
import {
  MatButtonModule,
  MatFormFieldModule,
  MatIconModule,
  MatInputModule,
  MatListModule,
  MatSelectModule,
  MatSidenavModule,
  MatCardModule,
  MatTableModule
} from "@angular/material";

@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    AppRoutingModule,
    HttpClientModule,
    MatButtonModule,
    MatFormFieldModule,
    MatIconModule,
    MatListModule,
    MatInputModule,
    MatSelectModule,
    MatSidenavModule,
    MatCardModule,
    MatTableModule
  ],....
})
export class AppModule {}
</code></pre>

<p>And there aren't any errors if I use <code>mat-card</code> in <code>app.component.html</code>. 
What am I missing here? </p>
