Angular2选择问题

杀手er

以下代码用于Angular 2 beta 13：

<select (change)="handleChange($event)">
    <option value="">-- please choose an option --</option>
    <option *ngFor="#option of options" [value]="option.id">{{ option.name }}</option>
</select>

所述options阵列可以是一样简单[{id: 0, name="First"}, {id: 1, name="Second"}]。我的意思是，过去所做的工作是，当做出新选择时，我能够获得所选选项的价值。现在，该值与标签（option的innerText ）相同。

现在，在Beta 14和15中，相同的代码不再起作用。是Angular 2的一个错误，还是我需要在自己的代码中引入了重大更改？

贡特·佐赫鲍尔（GünterZöchbauer）

你可以

通过在您options的ID中查找来获得分配给选项的值
或使用[ngValue]（在beta.15中引入）直接使用对象值

@Component({
    selector: 'my-app',
    template: `
    <div>selected: {{selected1 | json}}</div>
    <select (change)="handleChange($event)">
      <option value="">-- please choose an option --</option>
      <option *ngFor="#option of options" [value]="option.id">{{ option.name }}</option>
    </select>    

    <div>selected: {{selected2 | json}}</div>
    <select [(ngModel)]="selected2">
      <option value="">-- please choose an option --</option>
      <option *ngFor="#option of options" [ngValue]="option">{{ option.name }}</option>
    </select>`
})
export class AppComponent {
  options = [{id: 0, name:"First"}, {id: 1, name:"Second"}];
  selected1;
  selected2 = "";

  handleChange(event) {
    console.log(event.target.value);
    this.selected1 = this.options.filter((option) => {
      return option.id == event.target.value;
    })[0];    

  }
}

Plunker示例beta.16

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。