Error: Template parse errors: 'mat-card' is not a known element:

Question

I started an Angular 4 Material project about two months ago with all the current npm installs at that time, and am using most of the components from material.angular.io. since then Angular 5.0.0 has rolled out. I rebuilt by project on the new updates, and the console has the following error.

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.

I have checked the install, and believe I have everything current, but code that worked before is failing now. Is this a new requirement of A5, or are the material packages not ready for it?

Answer 1

In Angular 6

app.module.ts:

import { MatCardModule } from '@angular/material';
...
@NgModule({
    declarations: [
    AppComponent,...
],
imports: [
...
MatCardModule,
....
]
...

})

html:

<mat-card>
    <p>
    it works!
    </p>
</mat-card>