我一直在努力根据一个条件更改对话框的背景 colored颜色 .
ChangeColor是我正在判断是否为真的变量.用于更改其他标签的背景色.假设对话框可能需要某种进一步的覆盖.我所想要的就是在它上面覆盖一些东西,沿着这条线改变 colored颜色 .
我try 了内联的、全局的CSS样式.即使在带有样式的div中包装对话框内容也有奇怪的行为.
Updated Code:
我一直在努力根据一个条件更改对话框的背景 colored颜色 .
ChangeColor是我正在判断是否为真的变量.用于更改其他标签的背景色.假设对话框可能需要某种进一步的覆盖.我所想要的就是在它上面覆盖一些东西,沿着这条线改变 colored颜色 .
我try 了内联的、全局的CSS样式.即使在带有样式的div中包装对话框内容也有奇怪的行为.
Updated Code:
如果要更改对话框内容的 colored颜色 ,则需要使用styleClass
来设置对话框上的类,然后使用.p-dialog-title
、.p-dialog-content
和.p-dialog-footer
设置内部元素的样式.
下面是代码应该是什么样子.
<!-- template -->
<p-dialog
header="Long Content"
....
[styleClass]="changeColor ? 'lightgray' : ''"
>
:host ::ng-deep .lightgray .p-dialog-header {
background-color: lightgray;
}
:host ::ng-deep .lightgray .p-dialog-content {
background-color: lightgray;
}
:host ::ng-deep .lightgray .p-dialog-footer {
background-color: lightgray;
}
相反,如果你想在对话框后面有一个遮罩层,你可以在对话框上设置[modal]="true"
,让它在对话框后面显示一个透明层.