Manas
Manas

Reputation: 3330

How to show field only if a particular option is selected in Ionic?

I have a form and I want to show this button only if the first option is selected. I am using angular template-driven approach.

    <ion-item>
              <ion-label>Address:</ion-label>

              <ion-select ngModel name="estate">
                <ion-option [value]='1'>Estate1</ion-option>
                <ion-option [value]='2'>Estate2</ion-option>
                <ion-option [value]='3'>Estate 3</ion-option>
                 <ion-option [value]="4">Non-Residence</ion-option> 
              </ion-select>

            </ion-item>

            <ion-item *ngIf="estate == 1">
            <button ion-button round color="dark" >Estate1</button>
            </ion-item>

Upvotes: 0

Views: 1102

Answers (1)

Pengyy
Pengyy

Reputation: 38191

you should define estate by adding #estate to ion-select element

<ion-select #estate ngModel name="estate">

and you are binding string 1,2,3,4 to options, so the ngIf expression should be *ngIf="estate.value === '1'"

refer plunker demo(angular).

Upvotes: 2

Related Questions