Question

我在Angular 5中使用。我想在选择下拉值时绑定完整的JSON对象。所以我正面临着这个问题，因为双向数据绑定不起作用。当我应该编辑对象时，我没有在下拉列表中看到它的类型。以下是我的代码： HTML：＆lt; select class =“w3-input dropDown form-control”[（ngModel）] =“selectedTypes”name =“option”（change）=“onSelectedType（）”＆gt; ＆lt; option * ngFor =“let attribute of typeTypes” [ngValue] = “类型” [selected] =“selectedTypes.title === type.title？type.title：null”＆gt; {{type.title}}＆LT; /选项＆GT; ＆LT; /选择＆GT; TS： this.http.get（this.localClient +“attributes？q [_id] =”+ this.attributeId，{headers：this.rqstHeader}） .map（res =＆gt; res.json（）） .subscribe（data =＆gt; { this.attribute.title = data [0] .title; this.selectedTypes = data [0] .type; 的console.log（数据）; }）; 在这里，'this.attribute.title正常工作，因为我将它绑定到文本框。但是'selectedTypes'在编辑模式下无法正常工作。任何帮助将受到高度赞赏。

Answer 1

在Angular 5.x * ngFor中删除，使用NgForOf代替* ngFor。

TS文件

this.ResponseFromAPI = [
    {name : 'Name1', value : 'Value1'}, 
    {name : 'Name2', value : 'Value2'},
    {name : 'Name3', value : 'Value3'}
];

Html文件

<ng-template ngFor let-item [ngForOf]="ResponseFromAPI" let-i="index">
    <option [ngValue]="item.value"  >{{item.name}}</option>
</ng-template>

希望如此有帮助。：）

双向数据绑定不适用于<select>

1 个答案: