Menu ▾ ▴

#33 Need API to Close Modals

open
nobody
enhancement (5)
2016-09-20
2015-01-28
Anonymous
No

Originally created by: dwmkerr

See comment at:

http://www.dwmkerr.com/the-only-angularjs-modal-service-youll-ever-need/#comment-1810738299

It would be useful to have an API such as:

modalService.closeModals();

which simply closes any open modals. A potential use case is in the application router, where changing a URL should not leave the modal open. Even better would be:

modalService.closeModals(someValue);

Which would close all the modals and resolve their close promises with the value someValue. This would allow application developers to decide whether they want to allow consumers of modals to be able to handle the cases where they are closed externally explicitly.

Related

Tickets: #70

Discussion

  • Comment has been marked as spam. 
    Undo

    View and moderate all "tickets Discussion" comments posted by this user

    Mark all as spam, and block user from posting to "Tickets"

    Anonymous

    Anonymous - 2015-12-22

    Originally posted by: bushiko

    I needed to close an opened modal every time an ui router stateChange event fires. I ended up writing a decorator to keep track of opened modals promises:

      var decorator = function($delegate, $rootScope) {
    var ModalList = [];
    var originalShow = $delegate.showModal;
    $delegate.showModal = function(args) {
      // showModal retorna una promesa,
      // guardaré la lista de promesas para poderlas cerrar
      var promise = originalShow.apply(null, [args]);
      ModalList.push(promise);
      return promise;
    };
    $rootScope.$on('$stateChangeSuccess', function(event) {
      ModalList.forEach(function(modalPromise) {
        modalPromise.then(function(modal) {
          console.log('closing modal due to state change...');
          modal.element.modal('hide');
           // Remover de la lista
          var idx = ModalList.indexOf(modalPromise);
          ModalList.splice(idx, 1);
        })
      });
    });
    return $delegate
  }
  return decorator;

    and added like this in my module config phase:

    $provide.decorator('ModalService', decorator);
     

Log in to post a comment.