Ionic 3 показать ион-элемент на выбор

Question

Мне нужно показать элемент, когда я выбираю опцию, но я не уверен, как плохо это сделать, если кто-то может помочь, спасибо

    <ion-item>
        <ion-label floating>Reward </ion-label>
        <ion-select>
                <ion-option >Price reduction</ion-option>
                <ion-option (click)="onButtonClick()" >Discount </ion-option>
            </ion-select>
    </ion-item>

    <ion-item *ngIf="buttonClicked" >
        <ion-label floating>Discount Percentage </ion-label>
        <ion-input type="text" ></ion-input>

    </ion-item>

Я хочу, когда я нажимаю на скидку, тогда ионный элемент показывает другиемудрый это не покажет.он работает нормально на кнопку, когда я применяю его на ионный вариант его не работает.Заранее спасибо

Answer 1

Вместо этого используйте ionChange и поместите вызов функции в тег ion-select, а не ion-option.Поскольку вы хотите показывать div, только если в качестве скидки выбрано chouse, мы устанавливаем значение для опций и проверяем это в функции:

<ion-select (ionChange)="onButtonClick($event)">
  <ion-option value="reduction">Price reduction</ion-option>
  <ion-option value="discount">Discount</ion-option>
</ion-select>

TS:

onButtonClick(ev) {
  ev === 'discount' ? this.buttonClicked = true : this.buttonClicked = false;
}

StackBlitz