角度材质对话框中的透明背景

Question

我试图使用css var((更改角度材质对话框的颜色，但背景变为透明，而不是我需要的颜色。

Css样式：

.custom-dialog >  mat-dialog-container {
background: var(--background);
}

打开对话框功能：

openDialogForCreateDirectory(): void {
this.dialog.open(CreateDirectoryComponent, {
width: '400px',
panelClass: 'custom-dialog'
});
}

Answer 1

您需要使用::ng-deep将样式向下强制为有角度的材质组件：

::ng-deep .custom-dialog > mat-dialog-container {
background-color: var(--background);
}

参见工作示例：https://stackblitz.com/angular/ebnbevodyrv

Answer 2

要更改angular材质库UI中的任何内容，需要在styles.scss中添加css，即根级别。

参见此处