时间戳

首页 > 解决方案 > 剑道下拉列表弹出高度不起作用

angular - 剑道下拉列表弹出高度不起作用

问题描述

在这个StackBlitz 中，我有一个 Kendo for Angular 下拉列表，其弹出高度设置为 20px。尽管如此，当我打开下拉列表时，弹出高度保持不变。如何使这项工作？

@Component({
selector: 'my-app',
template: `
 <kendo-dropdownlist [data]="listItems" [popupSettings]="{ height: 20 }">
 </kendo-dropdownlist>
`
})
export class AppComponent {
  public listItems: Array<string> = ["Item 1", "Item 2", "Item 3", "Item 4"];
}

标签： angularkendo-uikendo-ui-angular2

解决方案

更好的方法是使用 popupClass 而不是 height。这使您能够定义为弹出窗口执行的 css 类。在该类中，您可以定义 min-height 等属性。

[popupSettings]="{ popupClass: 'myPopupClass' }"

查看文档

编辑：

在上述解决方案中，您似乎必须设置 ViewEncapsulation.None 并在 css 中设置 height 属性。

我找到了一个更简单的解决方案：

看起来你还必须设置' listHeight '。默认情况下，listHeight 为 200 像素。

看看这个Stackblitz

<kendo-dropdownlist [data]="listItems" [popupSettings]="{ height: 20 }" listHeight="20">
</kendo-dropdownlist>

推荐阅读