我基本上是试图将对象转换为数组并将其绑定到kendo-dropdown控件。当我直接使用@Input绑定时,下拉列表会绑定,但会出现一条错误,指出不支持data.map。基本上,下拉列表需要一个数组对象。当我将@@ getter和setter属性用于@Input时,我将Fundclass定义为undefined。有人可以告诉我问题出在哪里吗
get fundclass(): any {
return this._fundclass;
}
@Input()
set fundclass(fundclass: any) {
if (this.fundclass !== undefined ) {
this._fundclass = Object.keys(this.fundclass).map(key => ({type: key, value: this.fundclass[key]}));
}
}
JSON-为了清楚起见,我在调试过程中对对象进行了JSON.parse处理,目的只是为了显示对象的内部结构
"[{"FundClassId":13714,"FundClass":"Class D"},{"FundClassId":13717,"FundClass":"Class B"},{"FundClassId":13713,"FundClass":"Class A"},{"FundClassId":13716,"FundClass":"Class B1"},{"FundClassId":13715,"FundClass":"Class C"}]"
HTML
<kendo-dropdownlist style="width:170px" [data]="fundclass" [filterable]="false"
[(ngModel)]="fundclass" textField="FundClass" [valuePrimitive]="true"
valueField="FundClassId" (valueChange)="flashClassChanged($event)"></kendo-dropdownlist>
根据先前的建议更新了代码和UI。这里的问题是我看不到所有显示值都是基础值,即id的值
_fundclass: any;
get fundclass(): any {
return this._fundclass;
}
@Input()
set fundclass(fundclass: any) {
if (fundclass !== undefined ) {
this._fundclass = Object.keys(fundclass).map(key => ({text: key, value: fundclass[key]}));
}
}
标记
<kendo-dropdownlist style="width:170px" [data]="fundclass" [filterable]="false"
[(ngModel)]="fundclass" textField="key" [valuePrimitive]="true"
valueField="fundclass[key]" (valueChange)="flashClassChanged($event)"></kendo-dropdownlist>
答案 0 :(得分:0)
您正在使用的是findGroups
,它引用对象属性,因此请删除this.fundclass
部分以获取函数参数。
this
您甚至可以将Object.entries()
方法与Destructuring assignment结合使用来简化代码。
@Input()
set fundclass(fundclass: any) {
if (fundclass !== undefined ) {
//--^^^^^^^^--- here
this._fundclass = Object.keys(fundclass).map(key => ({text: key, value: fundclass[key]}));
// ---------------------------^^^^^^^^^^^---------------------------------^^^^^^^^^^^^^^^----- here
}
}
更新:问题出在模型绑定上,您正在使用同一模型,而绑定则将其更改为其他模型,否则,当您更改值时,所选值将设置为@Input()
set fundclass(fundclass: any) {
if (fundclass !== undefined ) {
this._fundclass = Object.entries(fundclass).map(([text, value]) => ({text, value}));
}
}
属性值,但下拉数据应为数组。
模板:
_fundclass
TS:
<kendo-dropdownlist style="width:170px" [data]="fundclass" [filterable]="false"
[(ngModel)]="fundclass1" textField="FundClass" [valuePrimitive]="true"
valueField="FundClassId" (valueChange)="flashClassChanged($event)"></kendo-dropdownlist>