Kendo UI Angular对话框 - 自定义对话框宽度

Question

如何设置自定义对话框的宽度？

我试着设置div的宽度，但没有什么区别。

任何帮助？

注：我不使用<kendo-dialog></kendo-dialog>标签，因为它是一个自定义对话框

代码：

<template #itemListRef> 
    <casts></casts> 
</template> 
<button (click)="showConfirmation(itemListRef)" class="k-button">Please confirm</button> 
<div kendoDialogContainer></div> 

Answer 1

指令答：

它看起来并不像有一个选项将宽度传递给对话服务。请参阅node_modules中的文件kendo-angular-dialog\dist\npm\dialog.service.js。

这意味着您必须使用全局CSS来设置框的宽度。你可以使用一个类在连指定该指令的选择：

HTML

<div class="dialog600"> 
    <div kendoDialogContainer></div> 
</div> 

CSS

.dialog600 .k-dialog {width: 600px} 

Plunker

---

老回答，假设使用的组件：

您可以简单地在选择器上使用[width]输入。

例如

<kendo-dialog [width]=1000>...</kendo-dialog> 

这会将对话框设置为1000px宽。

但是，请注意，这有效地设置对话框的max-width - 对话框不会溢出窗口外。对话框的min-width也风格450像素，作为设置主选择内与.k-dialog标签：

如果你试图去比450像素越小，你就必须设置用自己的造型覆盖min-width。