[英]How to not dismiss the alert box when clicking outside of it on Ionic
I am building a ionic 2 app and I am using the following component我正在构建一个 ionic 2 应用程序,我正在使用以下组件
http://ionicframework.com/docs/components/#alert 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();
}
}
How can I make sure that when I click outside the box the alert is not dismissed?如何确保当我在框外单击时不会解除警报?
As you can see in the AlertController docs , you can use the enableBackdropDismiss
(boolean) option when creating the alert:正如您在AlertController 文档中看到的,您可以在创建警报时使用enableBackdropDismiss
(boolean) 选项:
enableBackdropDismiss : Whether the alert should be dismissed by tapping the backdrop. enableBackdropDismiss :是否应通过点击背景来解除警报。 Default 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();
}
}
In Ionic 4/5 this property has been renamed to backdropDismiss
:在 Ionic 4/5 中,此属性已重命名为backdropDismiss
:
backdropDismiss : If true, the alert will be dismissed when the backdrop is clicked. 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();
}
}
在 ionic 4 中,该选项已重命名为
backdropDismiss: false
在 alertCtrl.create 选项中设置 enableBackdropDismiss: false
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.