在 Ionic 上單擊警報框外部時如何不關閉警報框

Question

我正在構建一個 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();
  }
}

如何確保當我在框外單擊時不會解除警報？

Answer 1

離子 2/3：

正如您在AlertController 文檔中看到的，您可以在創建警報時使用enableBackdropDismiss (boolean) 選項：

enableBackdropDismiss ：是否應通過點擊背景來解除警報。 默認為真

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/5：

在 Ionic 4/5 中，此屬性已重命名為backdropDismiss ：

backgroundDismiss ：如果為 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();
  }
}

Answer 2

在 ionic 4 中，該選項已重命名為

backdropDismiss: false

Answer 3

在 alertCtrl.create 選項中設置 enableBackdropDismiss: false