Question

在使用kendo对话框服务时，是否还要更改对话框窗口的颜色？

目前它默认为红色，但我需要根据传递的内容自定义窗口以显示不同的颜色。

我尝试使用kendo-dialog作为我的模板，但它没有显示操作按钮。

<kendo-dialog title="{{title}}" (close)="Cancel()" [ngClass]="yellow">
</kendo-dialog>

Answer 1

前一段时间我问过同样的问题，并提出了这篇文章中的解决方案：Kendo UI angular DialogService - Change the title bar background color

我会在这里复制我的答案：我为此工作了一个解决方案。它有效，但它不优雅一点。

以下是演示代码的plunker链接： http://plnkr.co/edit/MGw4Wt95v9XHp9YAdoMt?p=preview

以下是服务中的相关代码：

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;

scss：

$error: #c13;
$success: #0c5;

.kendo-override {

  &.error {
    kendo-dialog-titlebar {
      background-color: $error;
    }
  }

  &.success {
    kendo-dialog-titlebar {
      background-color: $success;
    }
  }
}

KendoUI对话框服务更改标题颜色

1 个答案: