Ion-select text value

Hey guys,
I’m having a problem getting the text value of an ion-select form input. Im using the FormBuilder.
My html template code is:

 <ion-select formControlName="foo">
    <ion-option value="1">Bar1</ion-option>
    <ion-option value="2">Bar2</ion-option>
</ion-select>

And my .ts class code is:

this.fooSelectForm = formBuilder.group({
      foo: ['', Validators.compose([Validators.pattern('[0-9]*'), Validators.required])]
});

I’m well aware of how to get the value i.e 1 and 2 using this.routeSelectForm.get(‘foo’).value. What I’m not sure of is how to get the text value i.e “Bar1” and “Bar2”

maybe there is a way but a value is a value, and this text is just a label above, maybe just change from value="1" to value="Bar1"

Thanks for the input. I cannot however take that approach cause I need both values. One for display and the other for DB functions

@Component({
  selector: 'my-app',
  template: `
    <div>
     <ion-select [ngModel]="selectbox" (ngModelChange)="onChange($event)">
       <ion-option *ngFor="let option of options" [ngValue]="option">
        {{option.text}}
       </ion-option>
     </ion-select>
    </div>
  `,
})
export class App {
  options;
  constructor() {
    this.selectbox = {};
    this.options = {
      options: [{text: 'Bar1', value: 1}, {text: 'Bar2', value: 2}]
    }
  }

  onChange(event: string) {
    console.log(event.text);
}
}

This is the code which can be useful for you.

Any way you could incorporate this to an ion-option used with the FormBuilder??

Sure. FormControls can take objects as values, not just scalars.

Hello! @Gizm0, did you solve this issue? If so please post your solution.