Gizm0
September 15, 2017, 1:30pm
1
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"
Gizm0
September 15, 2017, 1:57pm
3
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.
Gizm0
September 15, 2017, 3:01pm
5
Any way you could incorporate this to an ion-option used with the FormBuilder??
Sure. FormControl
s can take objects as values, not just scalars.
Ramsk
September 21, 2018, 12:01pm
7
Hello! @Gizm0 , did you solve this issue? If so please post your solution.