将选择元素绑定到角度上的对象

Question

将选择元素绑定到角度上的对象我对棱角分明是陌生的，我试着用新的做事方法来提高速度。我想将SELECT元素绑定到对象列表中-这很容易：@Component({    selector: 'myApp',    template: `<h1>My Application</h1>               <select [(ngModel)]="selectedValue">                  <option *ngFor="#c of countries" value="c.id">{{c.name}}</option>               </select>`})export class AppComponent{     countries = [        {id: 1, name: "United States"},        {id: 2, name: "Australia"}        {id: 3, name: "Canada"},        {id: 4, name: "Brazil"},        {id: 5, name: "England"}      ];     selectedValue = null;}在本例中，selectedValue似乎是一个数字-所选项的id。但是，我实际上希望绑定到Country对象本身，这样selectedValue就是对象，而不仅仅是id。我尝试更改选项的值，如下所示：<option *ngFor="#c of countries" value="c">{{c.name}}</option>但这似乎行不通。它似乎在我选择的价值中放置了一个对象-但不是我所期望的对象。你可以的在我的柱塞例子中看到这个.我还尝试绑定到Change事件，以便能够根据选定的id自行设置对象；但是，似乎在更新绑定ngModel之前，更改事件就会触发-这意味着我在此时无法访问新选定的值。是否有干净的方法将SELECT元素绑定到具有角2的对象？

Answer 1

这可能有助于：

<select [(ngModel)]="selectedValue">

      <option *ngFor="#c of countries" [value]="c.id">{{c.name}}</option>

</select>

Answer 2

您也可以这样做，而不需要使用[(ngModel)]在你的<select>标签

在ts文件中声明一个变量

toStr = JSON.stringify;

在模板中这样做

 <option *ngFor="let v of values;" [value]="toStr(v)">
      {{v}} </option>

然后使用

let value=JSON.parse(event.target.value)

将字符串解析为有效的JavaScript对象