web-dev-qa-db-ja.com

Ionicの外側をクリックして警告ボックスを閉じない方法

ionic 2アプリを構築していて、次のコンポーネントを使用しています

http://ionicframework.com/docs/components/#alert

  import { AlertController } from 'ionic-angular';

export class MyPage {
  constructor(public alertCtrl: AlertController) {
  }

  showAlert() {
    let alert = this.alertCtrl.create({
      title: 'New Friend!',
      subTitle: 'Your friend, Obi wan Kenobi, just accepted your friend request!',
      buttons: ['OK']
    });
    alert.present();
  }
}

ボックスの外側をクリックしてもアラートが消えないようにするにはどうすればよいですか？

angulartypescriptionic2ionic3ionic4
18
Ricardo Parro

イオン2/3：

The AlertController docs でわかるように、アラートを作成するときにenableBackdropDismiss（ブール）オプションを使用できます。

enableBackdropDismiss：背景をタップしてアラートを閉じるかどうか。デフォルトはtrue

import { AlertController } from 'ionic-angular';

// ...
export class MyPage {

  constructor(public alertCtrl: AlertController) {}

  showAlert() {
    let alert = this.alertCtrl.create({
      title: 'New Friend!',
      subTitle: 'Your friend, Obi wan Kenobi, just accepted your friend request!',
      buttons: ['OK'],
      enableBackdropDismiss: false // <- Here! :)
    });

    alert.present();
  }
}

イオン4：

In Ionic 4 このプロパティ はbackdropDismissに名前が変更されました：

backdropDismiss：trueの場合、背景がクリックされるとアラートは閉じられます。

import { AlertController } from '@ionic/angular';

//...
export class MyPage {

  constructor(public alertController: AlertController) {}

  async showAlert() {
    const alert = await this.alertController.create({
      header: 'Alert',
      subHeader: 'Subtitle',
      message: 'This is an alert message.',
      buttons: ['OK'],
      backdropDismiss: false // <- Here! :)
    });

    await alert.present();
  }
}
39
sebaferreras

ionic 4でオプションの名前が変更されました

backdropDismiss: false
10
Pete

AlertCtrl.createオプションでenableBackdropDismiss：falseを設定します

1
amuramoto