Angular Material对话框Dialog

一、引入对话框模块

import {MatDialogModule} from '@angular/material';并在import中声明。

二、使用

1.对话框组件

mat-dialog-title：对话框元素的标题。 滚动时保持固定在对话框顶部。

mat-dialog-content：对话框的可滚动内容容器。

mat-dialog-actions：对话框中底部操作按钮的容器。 滚动时固定在底部。

2.需要打开对话框的组件

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

3.对话框组件接收数据、回传数据

import{MatDialogRef,MAT_DIALOG_DATA}from'@angular/material/dialog';

效果：