Kendo ui KendoUI对话框服务更改标题颜色
在使用剑道对话服务时,是否需要更改对话窗口的颜色 目前它默认为红色,但我需要根据传递的内容自定义窗口以显示不同的颜色 我尝试使用剑道对话框作为模板,但它没有显示动作按钮Kendo ui KendoUI对话框服务更改标题颜色,kendo-ui,kendo-ui-angular2,Kendo Ui,Kendo Ui Angular2,在使用剑道对话服务时,是否需要更改对话窗口的颜色 目前它默认为红色,但我需要根据传递的内容自定义窗口以显示不同的颜色 我尝试使用剑道对话框作为模板,但它没有显示动作按钮 <kendo-dialog title="{{title}}" (close)="Cancel()" [ngClass]="yellow"> </kendo-dialog> 不久前,我问了自己同样的问题,并在这篇文章中找到了一个解决方案: 我将在这里复制我的答案: 我为此想出了一个解决办法。它能工作,但
<kendo-dialog title="{{title}}" (close)="Cancel()" [ngClass]="yellow">
</kendo-dialog>
不久前,我问了自己同样的问题,并在这篇文章中找到了一个解决方案: 我将在这里复制我的答案: 我为此想出了一个解决办法。它能工作,但一点也不优雅 下面是演示代码的plunker链接: 以下是服务中的相关代码:
const dialog: DialogRef = this.dialogService.open({
actions: message.actions,
content: MessageComponent,
title: message.title
});
const messageComponent = dialog.content.instance;
messageComponent.message = message;
//I get the dialog element and use jQuery to add classes to override styles.
//Let's say I had the error class as well.
const element = dialog.dialog.location.nativeElement;
$( element ).addClass( 'kendo-override ' + message.classes );
return dialog.result;
和SCS:
$error: #c13;
$success: #0c5;
.kendo-override {
&.error {
kendo-dialog-titlebar {
background-color: $error;
}
}
&.success {
kendo-dialog-titlebar {
background-color: $success;
}
}
}