Cannot set default selection on <ion-select> on Reactive form

Ionic Framework ionic-v3
1

I need to load <ion-select> dynamically in a reactive form.It is working fine.Now I need to set default selection.I have used selected attribute for that.But it is not working.Can you tell me why?

Here is the Plunker

app/home.page.html

<form [formGroup]="detailInformationForm" (submit)="goToSponsor(detailInformationForm)" novalidate>
    <ion-item>
      <ion-label>Donation</ion-label>
      <ion-select formControlName="donationdate">
        <ion-option *ngFor="let date of donationDates" value="{{date.donationdate}}" [selected]="date.isChecked">
          {{date.donationdate}}</ion-option>
      </ion-select>
    </ion-item>
       <button ion-button block type="submit" [disabled]="!detailInformationForm.valid">Next</button>
  </form>

app/home.page.ts

  export class HomePage {
  donationDates:any=[];
  detailInformationForm: FormGroup;

  constructor(public navController: NavController,public formBuilder: FormBuilder) { 
      this.donationDates = [
       {
          id: null,
          donationid: "2",
          donationdate: "2017-03-12",
          datedescription: "Vad Bij",
          isChecked:true
      },
      {
        id: null,
       donationid: "2",
       donationdate: "2017-03-19",
       datedescription: "Sud satam",
       isChecked:false
     }]
     
     this.detailInformationForm = formBuilder.group({
      donationdate: ['', Validators.required]
    });
  }

}
2 Likes