ionic-framework - Ionic 4 不是异步警报
问题描述
您好,我尝试在单击 ion-toggle 时打开警报以询问用户是否确定执行此操作,但是由于异步,在打开警报之前,togle 会发生变化...有人可以解释一下如何处理切换对警报采取行动?谢谢 !你可以在这里看到我的代码:
网页:
<ion-toggle slot="end" (ngModelChange)="onToggleAppareil(appareil)" [(ngModel)]="appareil.status"></ion-toggle>
TS功能:
public async onToggleAppareil(appareil:any){
if(appareil.status == true){
let alert = await this.alertCtl.create(
{
header: 'Voulez vous continuer ?',
message:'Cette action va éteindre l\'appareil sélectionné',
buttons:[
{
text:'Annuler',
handler: ()=>{
appareil.status = true;
},
role:'cancel',
cssClass:'secondary'
},
{
text:'Confirmer',
handler: ()=>{
appareil.status = false;
}
}
]
}
);
alert.present();
}
}
(仅当用户想要禁用切换时才会显示此警报,但如果取消则为 true => false => true 异步原因)
解决方案
您应该使用点击事件来触发您的功能
(click)="onToggleAppareil(appareil)"
ngModelChange在模型更改时触发,请在此处阅读更多信息:https ://stackoverflow.com/a/45075106/1934484
额外的
public async onToggleAppareil(appareil: { status: boolean }) {
if (appareil.status) { // thruthy values
let alert = await this.alertCtl.create(
{
header: 'Voulez vous continuer ?',
message:'Cette action va éteindre l\'appareil sélectionné',
buttons:[
{
text:'Annuler', // unnecessary to set to true because it is already true
role:'cancel',
cssClass:'secondary'
},
{
text:'Confirmer',
handler: () => appareil.status = false;
}
]
}
);
await alert.present(); // added await like stated in docs
}
}
推荐阅读
- vba - 获取两个日期之间的日期数组
- c - 使用 libevent 读取 chardevice
- php - Wordpress Nginx 永久链接从普通到 postname
- python - 在张量流中批量创建每个样本的条件
- angular - 数据表按钮单击角度 4
- php - PHP插入关联数组
- python - 在 python 中“重新创建”原始 256 字节 UDP 帧的最佳方法?
- r - 将列表中的所有 SpatialPolygonsDataFrame 对象聚合到一个 SpatialPolygonsDataFrame
- javascript - 如何限制用户仅使用新运算符调用函数?
- google-maps - 受限制的 Google API 密钥在反向地理编码中不起作用