如何移除MatDialog的默认背景效果？

要实现只保留表单部分、移除MatDialog的背景及默认容器样式，可按以下步骤操作：

1. 打开对话框时配置参数
   在触发对话框的组件代码中，调用MatDialog.open()时添加配置项，关闭背景遮罩并指定自定义样式类：

this.dialog.open(你的对话框组件类, {
  hasBackdrop: false, // 移除灰色背景遮罩
  panelClass: 'custom-dialog-panel' // 自定义面板样式类
});

2. 添加全局样式覆盖默认容器
   在项目的全局样式文件（如styles.scss）中，添加自定义类的样式，清除对话框容器的背景、阴影和内边距：

.custom-dialog-panel .mat-dialog-container {
  background-color: transparent;
  box-shadow: none;
  padding: 0;
}

这样设置后，MatDialog的默认容器样式会被清除，只会显示你自定义的form-container mat-elevation-z5区域，达到仅保留表单部分的效果。你的HTML代码无需修改，保持原有结构即可。

内容的提问来源于stack exchange，提问作者Wahéb