Lev
Lev

Reputation: 15684

check if ng bootstrap modal is already open

How can I check that a modal window is open ?

I define a property like this

  modalInstance: NgbModalRef;

and instantiate the modal like this

 this.modalInstance = this.modalService.open(UpdateModalContent);

I can't find any native property like this.modalReminderInstance.isOpen

Upvotes: 5

Views: 11176

Answers (2)

manfall19
manfall19

Reputation: 428

Actually, since you are using the modal service

this.modalInstance = this.modalService.open(UpdateModalContent)

you could use the "hasOpenModals" provided by the NgbModal class:

if (!this.modalService.hasOpenModals()) {
this.modalInstance = this.modalService.open(UpdateModalContent)
}

Upvotes: 2

svarog
svarog

Reputation: 9839

When you setup the modalInstance it returns a promise, while the modal is up that promise is set to pending, when the modal is closed the promise status will be set to either resolved or rejected. When a promise will resolve/reject one of it's handlers in the .then method will run.

var isModalOpen = false;
function openModal() {
    isModalOpen = true;
    modalInstance = $uibModal.open({...})
        .result.then(function () {
            // do something when resolved
        });
}

Another way is to utilize the callback methods .open provides you

The open method returns a modal instance, an object with the following properties:

opened (Type: promise) - Is resolved when a modal gets opened after downloading content's template and resolving all variables.

closed (Type: promise) - Is resolved when a modal is closed and the animation completes.

var isModalOpen = false;

function openModal() {
    var modalInstance = $uibModal.open({...});

    modalInstance.opened.then(function () {
            isModalOpen = true;
        });

    modalInstance.closed.then(function () {
            isModalOpen = false;
        });
}

Upvotes: 7

Related Questions