'mat-toolbar' is not a known element - Angular 5 : <p>I have created a new project, and I am trying to add <code>angular-material</code>.</p>

<p>I have created <code>material.module.ts</code> in my <code>app</code> folder:</p>

<pre><code>import { NgModule } from '@angular/core';

import {
    MatButtonModule,
    MatMenuModule,
    MatIconModule,
    MatCardModule,
    MatSidenavModule,
    MatFormFieldModule,
    MatInputModule,
    MatTooltipModule,
    MatToolbarModule
} from '@angular/material';

@NgModule({
    imports: [
        MatButtonModule,
        MatMenuModule,
        MatIconModule,
        MatCardModule,
        MatSidenavModule,
        MatFormFieldModule,
        MatInputModule,
        MatTooltipModule,
        MatToolbarModule,
    ],
    exports: [
        MatButtonModule,
        MatMenuModule,
        MatIconModule,
        MatCardModule,
        MatSidenavModule,
        MatFormFieldModule,
        MatInputModule,
        MatTooltipModule,
        MatToolbarModule
    ]
})
export class MaterialModule { }
</code></pre>

<p>and I have imported it into one of my components:</p>

<pre><code>import { MaterialModule } from '../material.module';
</code></pre>

<p>Furthermore, I have set up angular material in <code>index.html</code></p>

<pre><code>  &lt;link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"&gt;
</code></pre>

<p>in my <code>style.css</code> </p>

<pre><code>@import '~@angular/material/prebuilt-themes/pink-bluegrey.css';
</code></pre>

<p>I know that it is working cause I have shown a <code>material-icon</code> as a test:</p>

<pre><code>&lt;i class="material-icons"&gt;face&lt;/i&gt;
</code></pre>

<p>but when I try to create the footer it fails and it shows this message:</p>

<blockquote>
  <p>Uncaught Error: Template parse errors:
  'mat-toolbar' is not a known element:
  1. If 'mat-toolbar' is an Angular component, then verify that it is part of this module.
  2. If 'mat-toolbar' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. </p>
</blockquote>
