Question

更新：我在github上得到了答案。该错误将在Angular 2 beta 16中修复。这是＆lt; select＆gt;的简单双向数据绑定。使用plnkr进行现场演示。 @零件（{ 选择器：＆＃39; my-app＆＃39;，模板：` ＆lt; select [（ngModel）] =＆＃34; product.partCode＆＃34;＆gt; ＆lt; option * ngFor =＆＃34; #part of parts＆＃34; [值] =＆＃34; part.code＆＃34;＆GT; {{part.name}}＆LT; /选项＆GT; ＆LT; /选择＆GT; ＆lt; select [（ngModel）] =＆＃34; product.levelCode＆＃34;＆gt; ＆lt; option * ngFor =＆＃34; #level of levels＆＃34; [值] =＆＃34; level.code＆＃34;＆GT; {{level.name}}＆LT; /选项＆GT; ＆LT; /选择＆GT; {{产品| JSON}} ` }）出口类App { product = {partCode：＆＃39; aa＆＃39;，levelCode：＆＃39; lv1＆＃39; }; 零件= [ {code：＆＃39; aa＆＃39;，name：＆＃39; AA＆＃39; }， {code：＆＃39; bb＆＃39;，name：＆＃39; BB＆＃39; } ]。等级= [ {code：＆＃39; lv1＆＃39;，name：＆＃39; Level 1＆＃39; }， {code：＆＃39; lv2＆＃39;，name：＆＃39; Level 2＆＃39; } ]。 } 当您选择新选项时，{{product | json}}可以显示更改。这适用于Chrome，Safari和Opera。但是，当我使用Firefox Developer Edition 47.0a2和Firefox Nightly 48.0a1时，{{product | json}}不会发生变化。我怎样才能让它在Firefox中运行？谢谢或者它可能是一个错误？我应该向Angular 2或Firefox报告吗？

Answer 1

在Firefox上看起来像选择双向数据绑定，我尝试使用Angular2文档中的示例： https://angular.io/resources/live-examples/forms/ts/plnkr.html它与您的问题相同。

在修复错误之前，您可以使用更旧的时尚代码替换，例如：

import {Component} from 'angular2/core'

@Component({
  selector: 'my-app',
  template: `
    <select (change)="selectPart($event)">
      <option *ngFor="#part of parts" [value]="part.code">{{part.name}}</option>
    </select>
    <select (change)="selectLevel($event)">  
      <option *ngFor="#level of levels" [value]="level.code">{{level.name}}</option>
    </select>
    {{product|json}}
  `
})
export class App {
  product = { partCode: 'aa', levelCode: 'lv1' };
  parts = [
    { code: 'aa', name: 'AA' },
    { code: 'bb', name: 'BB' }
  ];

  levels = [
    { code: 'lv1', name: 'Level 1' },
    { code: 'lv2', name: 'Level 2' }
  ];

  selectPart($event) {
    this.product.partCode = $event.target.value; 
  }

  selectLevel($event) {
    this.product.levelCode = $event.target.value;
  }
}

更新了plunker：http://plnkr.co/edit/4cHCyBrSI932LOKKcxEN?p=preview

如何让双向数据绑定<select>在Firefox

1 个答案: