Kendo DropDownList,嵌套对象为TextField

问题描述 投票:1回答:1

我有一个kendo-dropdownlist,想将textField属性分配给位于嵌套对象内的属性。

用户对象:

{ 
  id: 123456  <--valueField
  contact: {
      name: Jane Doe <--textField
      email: 
      ...
  }
}

问题是Kendo不在选定的框或下拉列表中显示名称,因为它似乎无法在contact对象中找到contact.name属性或任何其他属性。

这里是我的配置方式,并假设它是因为网格的kendo-grid-column field属性可以使用嵌套的对象属性名称:

<kendo-dropdownlist id="profileOwner"
                    [data]="userData"
                    [textField]="'contact.name'"
                    [valueField]="'id'"
                    [(ngModel)]="profileOwner"
                    [valuePrimitive]="true"></kendo-dropdownlist>

[我知道Kendo可以找到对象,因为当我将文本字段设置为[textField]="'contact'"时,它会显示以下内容:Object,Object

我尝试过各种配置:

<kendo-dropdownlist id="profileOwner"
                    [data]="userData"
                    [textField]="contact.name"  <-- Cannot find object error 
                    [valueField]="'id'"
                    [(ngModel)]="profileOwner"
                    [valuePrimitive]="true"></kendo-dropdownlist>
---
<kendo-dropdownlist id="profileOwner"
                    [data]="userData"
                    textField="contact.name"  <-- I still get Nothing
                    valueField="id"
                    [(ngModel)]="profileOwner"
                    [valuePrimitive]="true"></kendo-dropdownlist>

发布此帖子之前,我打算采取的解决方法是使用项目模板显示值。这将成功在下拉窗口中显示值,但不会在所选框中显示这些值:

<kendo-dropdownlist id="profileOwner"
                    [data]="userData"
                    [textField]="'contact.name'"
                    [valueField]="'id'"
                    [(ngModel)]="profileOwner"
                    [valuePrimitive]="true">
         <ng-template kendoDropDownListItemTemplate let-dataItem>
                <span class="template">{{ dataItem.contact.name }}</span>
         </ng-template>
</kendo-dropdownlist>

Workaround attempt

版本信息:

Angular: 7.2.9
@progress/kendo-angular-dropdowns: ^3.5.0
angular kendo-ui telerik
1个回答
0
投票

简单。只需如下更改您的代码:

<kendo-dropdownlist id="profileOwner"
                    [data]="userData"
                    [textField]="contact.name"
                    [valueField]="id"
                    [(ngModel)]="profileOwner"
                    [valuePrimitive]="true"></kendo-dropdownlist>

这是因为您为什么要绑定例如id行[valueField]="id"而不是字符串[valueField]="'id'"

© www.soinside.com 2019 - 2024. All rights reserved.