Prevent duplicate Toast messages in Ionic
You can use a property on that page to know if a toast is being shown or not before showing a new one.
Ionic 2/3
import { ToastController, Toast } from 'ionic-angular';
// ...
private isToastVisible: boolean;
constructor(private toastCtrl: ToastController) { }
presentToast() {
if(this.isToastVisible) {
return;
}
this.isToastVisible = true;
const toast: Toast = this.toastCtrl.create({
message: 'User was added successfully',
duration: 3000,
position: 'top'
});
toast.onDidDismiss(() => {
this.isToastVisible = false;
});
toast.present();
}
Ionic 4/5
import { ToastController } from '@ionic/angular';
// ...
private isToastVisible: boolean;
constructor(private toastCtrl: ToastController) { }
presentToast() {
if(this.isToastVisible) {
return;
}
this.isToastVisible = true;
this.toastCtrl.create({
message: 'User was added successfully',
duration: 3000,
position: 'top'
}).then((toast: HTMLIonToastElement) => {
toast.onDidDismiss().then(() => {
this.isToastVisible = false;
});
toast.present();
})
}