Ionic 2 Select - Passing value as param. from selection box

Ionic Framework ionic-v3
1

Hello Ionic community!

I have a problem passing a value from the selector to a typescript method. Here is the code:

<ion-select #C (ionChange)="changeSelect(C.value)">
    <ion-option value="1">U1</ion-option>
  </ion-select>

Passing the value works, but somehow the comparison doesnt. I changed "line == ‘U1’ " to “line == line” just to test and it worked. Why isn’t it passing the string correctly or why can’t I compare it?

changeSelect(line: string) {
    if (line == 'U1') {
      this.stations.push({ text: 'TEXT' });
    }
  }

Thank you in advance!

Regards,

Laurids

2

Why aren’t you just binding via ngModel, so you will already have the value in the component controller code?

3

I wasn’t aware of that. How would that look in my implementation? Sorry I super bad with angular :confused:

4

Just like it does in the docs for ion-select.

5

thank you! but how will I pass it to my method then?

6

You don’t have to. Whatever property you bind [(ngModel)] to will automatically contain the currently selected value.

7

Thanks! So I just ask "property" == "myValue" ?

8

I would suggest taking the time to work through the Tour of Heroes, after which this should all make sense to you.

9

Thank you very much. What I still don’t get is how I will make an action depending on what I selected. (sorry my brain is a though one and I am like 7 hours into this which makes it even harder).

I want

if(selectedValue = aValue1){
doSomething
}
else if(selectedValue = aValue2){
doSomething
}

etc.

Sorry for making you a hard time.

10

It looks like you are comparing the label and not the value of the selected option. The ion-option in your select has value set to 1 and not U1
<ion-option value="1">U1</ion-option>

Try this if it works

changeSelect(line: string) {
    if (line == "1") {
      this.stations.push({ text: 'TEXT' });
    }

}

11

Thanks for your reply, sadly this didn’t change anything

12

[(ngMode)]=“dataTocheck”

if(dataTocheck== aValue1){
doSomething
}

do something like this

13

Thank you for your reply, how do I need to compare dataToCheck it tells me this in the console:

 Cannot find name 'dataToCheck'.

       L25:      if (dataToCheck == 'U1') {
       L26:        this.showAlert();
1 Like
14

In your component Add [(ngModel)]

 <ion-select [(ngModel)]="gender"  (ionChange)="changeSelect(gender)">
   <ion-option value="f" selected="true">Female</ion-option>
    <ion-option value="m">Male</ion-option>
  </ion-select>

In your controller declare:

public gender:string;
constructor() {}
changeSelect(gender){
if(gender==‘f’)…
}

1 Like
15

ohh it finally worked thank you so much!!

16

You’re really overcomplicating this. There is no need to pass anything to the change handler. It is already in the bound object property.

changeSelect() {
  if (this.gender === 'M')
}
17

You’re in right @rapropos, is not need to pass any parameter.

18

How can I do same code using button?
[(ngMode)]=“height”
[(ngMode)]=“weight”

Get your plan is my button including next function in that

next(){
if(height== h1 || weight==w1 ){
doSomething
}
else{
do something like this
}
}
Can I get the proper solution for this?

19

What happens when you try to use that code?

20

It well work just compare passed value with 1 insted of “U1”