Error 'mat-dialog-content' is not a known element

Issue

I am trying to create a login form using angular-material. I am using @angular/material": "^7.3.0.

In app.module.ts i have imported the following and placed them in the imports array as well,

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

In message.components.ts i have the following

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() {
          }
        }

In my template message.component.html i have,

<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>

I am getting the errors for mat-dialog-actions & mat-dialog-content,

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

As per the documentation angular-material both directives are available. What could be wrong in the code ? Thank you in advance.

Solution

It looks like you forgot to import the MatDialogModule into your AppModule (at least I don't see it in the list of imports provided).
For future reference, the first line of the API documentation tab will tell you the module(s) you need to import.

Answered By - Jonathan Seed