Service de boîte de dialogue KendoUI changer la couleur du titre

Question

Est-il possible de changer la couleur de la fenêtre de dialogue lors de l'utilisation du service de dialogue kendo?

Actuellement, il est par défaut en rouge, mais j'ai besoin de personnaliser la fenêtre pour montrer une couleur différente en fonction de ce qui est passé.

J'ai essayé d'utiliser une boîte de dialogue de kendo comme modèle, mais elle n'affiche pas les boutons d'action.

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

Answer 1

je me suis posé la même question il y a quelque temps et est venu avec une solution trouvée dans ce post: Kendo UI angular DialogService - Change the title bar background color

Je vais copier ma réponse ici: j'ai travaillé une solution pour cela. Ca marche mais ce n'est pas un peu élégant.

Voici le lien plunker qui montre le code: http://plnkr.co/edit/MGw4Wt95v9XHp9YAdoMt?p=preview

Voici le code correspondant au service:

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; 

Et le SCSS:

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

.kendo-override { 

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

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