Нажмите на кнопку переключения иона и отметьте также - PullRequest
0 голосов
/ 29 мая 2020

Я создаю страницу с помощью ioni c 5.

Я делаю кнопку «запомнить меня» с помощью ионного переключателя.

 <IonItem>
            <Ion-Label>remember me</Ion-Label>
            <Ion-toggle class="button">
   </Ion-toggle>
          </IonItem>

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

Я перепробовал много решений.

Ссылка: https://ionicframework.com/docs/api/toggle

Есть ли способ сделать и переключатель ion, и текст интерактивным?

Я использую ioni c angular

Заранее спасибо

Ответы [ 2 ]

1 голос
/ 29 мая 2020

Вот как вы можете сделать:

  • добавить идентификатор Ioni c к переключателю, например, #mytoggle
  • используйте идентификатор в (click) метка для переключения свойства .checked

код:

<ion-item>
    <ion-label (click)="mytoggle.checked = !mytoggle.checked">remember me</ion-label>
    <ion-toggle #mytoggle class="button"></ion-toggle>
</ion-item>

Попробуйте в stackblitz

0 голосов
/ 29 мая 2020

В файле ts: Объявить:

@ViewChild('mytoggle', {static: true}) mytoggle: IonToggle;

changeToggle() {
    const toggle = this.mytoggle.checked;
    toggle = !toggle;
}

В html:

 <ion-item>
            <ion-label (click)="changeToggle()">remember me</ion-label>
            <ion-toggle class="button">
   </ion-toggle>
          </ion-item>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...