set option with formgroup in dropdowns option in angular-CodePudding

I have setup this formgroup

 holidayform: FormGroup;

 this.holidayform = this.fb.group({
      title: ['', [Validators.required]],
      entryDate: ['',],
    })

 this.holidayform.patchValue({
      title: data.title,
      entryDate: data.entryDate,
 })

this is my dropdown in my component :

<form [formGroup]="holidayform">
 <select > <option value="Globals" [selected]="holidayform.title=='Globals'">Global</option>
 <option value="Locals" [selected]="holidayform.title=='Locals'">Local</option>
 </select>

[selected]="holidayform.title=='Globals'" this is not working i want to select it based on the value i patched in the formgroup.

Any solution Thanks

CodePudding user response：

The selection is defined by the bound FormControl. Tell Angular, that the select is bound to the title control within holidayform by using formControlName. Now, if data.title is Globals when you patch it, Global option gets selected.

<form [formGroup]="holidayform">
  <select  formControlName="title">
    <option value="Globals">Global</option>
    <option value="Locals">Local</option>
  </select>