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

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (98)

想将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似乎是一个数字。

实际上希望绑定到Country对象本身,这样selectedValue就是对象,而不仅仅是id,如下所示:

<option *ngFor="#c of countries" value="c">{{c.name}}</option>
提问于
用户回答回答于
<h1>My Application</h1>
<select [(ngModel)]="selectedValue">
  <option *ngFor="let c of countries" [ngValue]="c">{{c.name}}</option>
</select>

柱塞实例

如果value是一个对象,预选的实例需要与其中一个值相同。

<select [compareWith]="compareFn" ...

热门问答

在serverless中,我能否自己host 一个express(nodejs)的服务?

Tina

腾讯云 · 产品经理 (已认证)

Go Serverless!
推荐
您好,可以这样的。您可以参考如下文档,申请下http function 您可以使用常见的 WEB 框架(如 Nodejs Web 框架:Express、Koa)编写 HTTP 函数。而 WEB 框架内置的一些中间件(如cors)也会极大的方便您的业务编写 文档链接 https:...... 展开详请

为何我使用.Net API 生成的临时密钥无法进行文件操作?

推荐
cos有自己的密钥系统,应该是在控制台上,访问管理,API密钥,项目密钥那里,或者去看看cos的文档是如何说明的吧。 你通过ms接口创建cos临时密钥,也许的确会被限制一些,这个需要ms这个产品的人回答下比较好。 生成临时密钥和哪个SDK无关,可以直接在线调用也可以生成,通过AP...... 展开详请

存储桶的默认加速域名 cdn 如何更改业务类型, 即把静态加速改成下载加速?

Jinqn

腾讯 · 高级工程师 (已认证)

腾讯云COS前端开发
推荐

我理解你意思是,浏览器打开的时候要下载,不要直接显示。

通过存储桶的文件 Content-Type 来控制

新版乐加固 不支持 64位应用?

Richel码农
推荐
1.麻烦确认应用自身apk中是否存在64位支持库【应用自身不存在64位支持库的话,加固后是肯定不存在的 2.乐固最新版本已适配arm64位,请更新版本或直接在官网进行加固; 3.乐固目前暂时未支持x86-64位,如需上架GooglePlay,需先删除x86支持 ... 展开详请

树莓派4能够连上腾讯云物联网平台吗?

DylanRichard

腾讯 · 产品经理 (已认证)

万物互联的时代,欢迎来到IoT的世界
推荐

请问微信云支付是否有沙箱环境?

HKC

红客学院 · 创始人 (已认证)

道可道 非常道 名可名 非常名
推荐
微信支付沙箱环境,是提供给微信支付商户的开发者,用于模拟支付及回调通知。以验证商户是否理解回调通知、账单格式,以及是否对异常做了正确的处理。 ◆ 如何对接沙箱环境? 1、修改商户自有程序或配置中,微信支付api的链接,如:被扫支付官网的url为:https://api.mch.w...... 展开详请

所属标签

扫码关注云+社区

领取腾讯云代金券