DropDown弹出窗口宽度（Telerik：Angular的Kendo UI）

Question

如何将DropDown弹出窗口宽度设置为自动，以便所有文本都可见？我想为小部件保持较小的宽度，但弹出窗口的宽度较大。

已更新：

Link to Plunkr

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  styles: ['kendo-dropdownlist { width: 6em;}'],
  template: `
    <kendo-dropdownlist
        [data]="listItems"
        [textField]="'text'"
        [valueField]="'value'"
        [value]="selectedValue"
    >
        <ng-template kendoDropDownListValueTemplate let-dataItem>
            <span>{{ dataItem?.value }}</span>&nbsp;{{ dataItem?.text }}
        </ng-template>
        <ng-template kendoDropDownListItemTemplate let-dataItem>
            <span>{{ dataItem.value }}</span> {{ dataItem.text }} - Dummy text
        </ng-template>
    </kendo-dropdownlist>
  `
})
export class AppComponent {
    public listItems: Array<{ text: string, value: number }> = [
        { text: "Small", value: 1 },
        { text: "Medium", value: 2 },
        { text: "Large", value: 3 }
    ];

    public selectedValue: { text: string, value: number } = { text: "Foo", value: 1 };
}

Answer 1

我建议您将popup width设置为auto。因此物品不会包裹：

<kendo-dropdownlist
    [data]="listItems"
    [textField]="'text'"
    [valueField]="'value'"
    [value]="selectedValue"
    [popupSettings]="{ width: 'auto' }"
>

http://plnkr.co/edit/dqlInPutekCnwdt7KFek?p=preview