Prevent multiple Ionic Alerts from stacking up

Question

How can I detect if ionic 2 alert ui component instance is already open in order not to present another alert ?

Answer 1

I have another idea that you can assign message for a variable and check new message is equal to it or not. If equal, return. This is my code and hope you enjoy with it.

import { Injectable } from '@angular/core';
import { AlertController } from 'ionic-angular';

@Injectable()
export class AlertProvider {

  public showingMessage = ""

  constructor(
    private alertController: AlertController
  ) {}

  showAlert(message) {
    // Check this message is showing or not
    if (message === this.showingMessage) {
      return
    }

    this.showingMessage = message
    this.alertController.create({
      title: "APP_NAME",
      message: message,
      buttons: [{
        text: "OK",
        handler: () => {
          this.showingMessage = ""
        }
      }]
    }).present()
  }
}

Answer 2

I ended up writing a wrapping provider for Ionic's Alert controller like so :

import { Injectable } from '@angular/core';
import { AlertController } from 'ionic-angular';

@Injectable()
export class Alert {
  public alertPresented: any;
  constructor(public alertCtrl: AlertController) {
    this.alertPresented = false
  }

  present(title, subTitle) {
    let vm = this
    if(!vm.alertPresented) {
      vm.alertPresented = true
      vm.alertCtrl.create({
        title: title,
        subTitle: subTitle,
        buttons: [{
          text: 'OK',
          handler: () => {
            vm.alertPresented = false
          }
        }],
      }).present();
    }
  }
}

where alertPresented flag prevents more than one instance from being presented