4

Angular2, in my ts, I have a control group, how can I have the two-way binding for the select in my html using ngFormControl?

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>
Hammer
  • 8,538
  • 12
  • 44
  • 75

2 Answers2

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

where someProperty is a property on the components class that holds the value or

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

This only works properly on all browsers if you have a recent Angular2 version (>= beta.16)

Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
0

In this example selected atribute is not working ! But in ts file

  • For the ngModel : You can write as someProperty = Day
  • For the ngFormControl: You can also write as selectControl.value= Day

It will works fine.

Dr. X
  • 2,890
  • 2
  • 15
  • 37