首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >将select元素绑定到Angular中的对象

将select元素绑定到Angular中的对象
EN

Stack Overflow用户
提问于 2016-03-12 00:15:54
回答 13查看 597.1K关注 0票数 489

我想将一个select元素绑定到一个对象列表--这非常简单:

代码语言:javascript
复制
@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。我尝试像这样更改选项的值:

代码语言:javascript
复制
<option *ngFor="#c of countries" value="c">{{c.name}}</option>

但这似乎并不管用。它似乎在我的selectedValue中放置了一个对象--但不是我期望的对象。你可以使用see this in my Plunker example

我还尝试绑定到change事件,以便可以根据选择的id自己设置对象;但是,change事件似乎是在绑定的ngModel更新之前触发的--这意味着我当时无法访问新选择的值。

有没有一种干净利落的方法可以把select元素绑定到角度为2的对象上?

EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/35945001

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档