我想在角度2应用程序中显示可选对象的集合(RC 5,形式0.3.0)
<select [(ngModel)]="selectedItem">
<option *ngFor="let item of selectableItems"
[value]="item">
{{ item }}
</option>
</select>
<div> {{ selectedItem }} </div>
列表本身已正确显示.
但是’selectedItem’显示的所有内容都是[object Object].在代码中访问项目时,我得到相应的字符串“[object Object]”.我尝试切换到ngValue但产生相同的结果.
当我使用原始值而不是对象时,整个过程都有效.但我怀疑我在这里错过了一些关键点.
谢谢你的帮助.我一直在互联网搜索和反复试验上浪费了几个小时.也许有人遇到过同样的问题.
编辑(24-08-16)：我遇到了这个教程,它解释了如何创建常用窗体小部件.也许对于登陆此页面的人来说这是有用的：https://scotch.io/tutorials/how-to-deal-with-different-form-controls-in-angular-2
解决方法
从你的代码和解释,我认为“item”是一个复杂的对象,而不是一个简单的对象.因此,要在HTML中显示它,您将使用：
<div> {{ selectedItem | json }} </div>
在代码中,您必须访问“item”属性(如item.value或项目的属性.如果您想使用简单的值,您可以执行以下操作：
<select [(ngModel)]="selectedItem">
<option *ngFor="let item of selectableItems"
[value]="item.id">
{{ item }}
</option>
</select>
这当然是假设item是一个复杂的类型.
编辑
经过一番挖掘(因为这也困扰了我),我找到了我真正想要的解决方案！要使用复杂对象,您只需在绑定值时使用[ngValue]！修复程序在https://github.com/angular/angular/issues/4843中描述.所以上面的内容将如下所示：
<select [(ngModel)]="selectedItem">
<option *ngFor="let item of selectableItems"
[ngValue]="item">
{{item}}
</option>
</select>
