select Angular2 的双向绑定

Question

Angular2，在我的 ts 中，我有一个控制组，我如何使用 ngFormControl 在我的 html 中对 select 进行双向绑定？

form.component.ts

this._reportGeneratingForm = fb.group({
 ......

  selectedGroup: ['']
})

form.component.html

  <select class="form-control" ????>
      <option>Day</option>
      <option>Hour</option>
      <option>week</option>
      <option>Month</option>
    </select>

Answer 1

<select class="form-control" [(ngModel)]="someProperty">
  <option>Day</option>
  <option>Hour</option>
  <option>week</option>
  <option>Month</option>
</select>

其中 someProperty 是组件 class 上的属性，它包含值 or

<select class="form-control" [ngFormControl]="selectControl">
  <option>Day</option>
  <option>Hour</option>
  <option>week</option>
  <option>Month</option>
</select>

如果您有最新的 Angular2 版本 (>= beta.16)，这仅适用于所有浏览器

Answer 2

在此示例中，所选属性无效！但是在 ts 文件中

对于 ngModel ：你可以写成 someProperty = Day
对于ngFormControl：你也可以写成selectControl.value= Day

它将正常工作。

select Angular2 的双向绑定

Two-way binding for select Angular2

angular2-forms

angular