CODEWITHSUNDEEP
selectionic-frameworkionic2
mishap
mishap

Reputation: 8505

Ionic 2 ion-selected doesn't show the selected option

Using model driven form to select default option, so residence is already set:

<ion-select formControlName="residence">
   <ion-option [value]='"0"'>{{freeCalcForm.controls.partyAName.value}}</ion-option>
   <ion-option [value]='"1"'>{{freeCalcForm.controls.partyBName.value}}</ion-option>
</ion-select>

I don't see the selected value: enter image description here

But clicking on the ion-select shows that the value is already selected correctly:

enter image description here

I tried selected="true" and selected="selected" on first option without any effect.

Upvotes: 2

Views: 7204

Answers (1)

Schlaus
Schlaus

Reputation: 19212

You should bind a model to your select:

<ion-select [(ngModel)]="myModel">

and set your default selection in the model. For example:

// page.html
<ion-select [(ngModel)]="gender">
  <ion-option value="f">Female</ion-option>
  <ion-option value="m">Male</ion-option>
</ion-select>

// page.js
export class BasicPage {
  gender: string = "f";
}

Example truncated from here.

Upvotes: 2

Related Questions