ドロップダウンポップアップの幅（Telerik：剣道UI for Angular）

Question

ドロップダウンポップアップの幅をautoに設定すると、すべてのテキストが表示されます。私はウィジェットの幅を小さくしたいが、ポップアップの幅を大きくする。

更新：

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 widthautoに設定することをお勧め。したがって、項目は折り返されません。

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

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