angular - Fel 'mat-dialog-content' är inte ett känt element

Jag försöker skapa ett inloggningsformulär med Angular Material. Jag använder @angular/material": "^7.3.0.

I app.module.ts har jag importerat följande och placerat dem i imports-arrayen också,

import {
  MatToolbarModule, MatFormFieldModule, MatInputModule,
  MatOptionModule, MatSelectModule, MatIconModule, 
  MatButtonModule, MatCardModule, MatTableModule,
  MatDividerModule, MatSnackBarModule
} from '@angular/material';

I message.components.ts har jag följande

import { MatDialogRef, MAT_DIALOG_DATA, MatDialog } from '@angular/material';
import { Component, OnInit, Inject, Injectable } from '@angular/core';

@Component({
  selector: 'app-message',
  templateUrl: './message.component.html',
  styleUrls: ['./message.component.css']
})

export class MessageComponent implements OnInit {
  constructor(private dialogRef: MatDialogRef<MessageComponent>, 
               @Inject(MAT_DIALOG_DATA) public data: any) {
          }
          public closeMe() {
            this.dialogRef.close();
          }
          ngOnInit() {
          }
        }

I min mall message.component.html har jag,

<h1 mat-dialog-title>Message</h1>
<mat-dialog-content> </mat-dialog-content>
<mat-dialog-actions>
  <button mat-raised-button (click)="closeMe()">Close</button>
</mat-dialog-actions>

Jag får felen för mat-dialog-actions & mat-dialog-content,

'mat-dialog-content' is not a known element:
'mat-dialog-actions' is not a known element:

Enligt dokumentationen för angular-material är båda direktiven tillgängliga. Vad kan vara fel i koden? Tack på förhand.

Svar #1

Det ser ut som att du glömde importera MatDialogModule till din AppModule (åtminstone ser jag det inte i listan över importer som tillhandahölls).
För framtida referens, den första raden i API-dokumentationsfliken kommer att berätta vilka modul(er) du behöver importera.

Svar #2

Jag håller med Jonathans svar och jag lägger till fullständiga detaljer med exempel med provkod:

det kommer också att lösa problem med fel: mat-dialog-actions' är inte ett känt element

Lägg till DataDialogComponent i deklarationerna och i entryComponents i app.module.ts

 import {MatDialogModule } from '@angular/material/dialog';


   @NgModule({
    declarations: [
       AppComponent,
       MatDialogModule
    ],
    imports: [
       BrowserModule,
       AppRoutingModule,
       BrowserAnimationsModule,
       ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production }),
       LayoutModule,

    ],
    providers: [],
    entryComponents:[MatDialogModule],
    bootstrap: [AppComponent]
    })
export class AppModule { }

Relaterade artiklar