将背景图像添加到mat对话框中

Question

我试图添加一个背景图像到垫-对话框，但它没有显示在任何。我甚至尝试过使用panelClass，但没有成功。

.custom-panel .mat-dialog-container {
    background-image: url("../../../../assets/images/alerts/error-bg.png") !important;
    background-repeat: no-repeat;

    .mat-dialog-title {
        font-family: $fnt-main;
    }
}

​

​

​

​

​

​

Answer 1

您必须在根styles.scss文件中添加.定制面板类及其包含的样式。

Answer 2

假设您有一个组件是您在mat对话框中显示的，那么您应该将这种背景样式添加到css/scss中，如下所示：

:host {
    background-image: url(<the-right-location-of-your-image>);
    background-repeat: no-repeat;
}

阅读这里关于样式隔离的详细说明。