Add possibility to close popup from directive.

[piernik]

You need to add possibility to close popup from code (not just buttons).

I'll use dangeross' example: http://codepen.io/dangeross/pen/wvAjJ/2
Open modal and then Add popup.
Should close popup after clicking option. Now I have to make two taps.

[ajoslin]

Possibility: Change popup API a bit, creating our own 'then' and also adding a close function.

var pop = $ionicPopup.show(...)
pop.then(function(response) {
});
$scope.closePopEarly = function() {
  pop.close();
};

[piernik]

That was fast:) Thanks I'll try.. when it will be ready ;)

[ajoslin]

It isn't implemented yet, it's an idea for implementing what you want though.

[mlynch]

I'll take a look at this one. Thanks Andy, good idea

[mlynch]

Okay, took a slightly different approach for now:

$ionicPopup.show(...)
.then(function(response) {
}, function(err) {},
function(popup) {
});

You'll get the constructed popup in the notify function of the promise.

We should probably revisit this API later.

[stefanKuijers]

Hey guys,

First of all: Awesome job on the Ionic project. It's really great :D

I'm trying to close the popup but with no success. Here's what I tried:

• checked documentation. It says the service returns an object with the function close() http://ionicframework.com/docs/api/service/$ionicPopup/
• Downloaded the latest nightly: http://code.ionicframework.com/#nightly
• Tried this:

var popup = $ionicPopup.show({
               templateUrl: 'view/dialog/med_reminder.html',
               title: "Title",
               scope: $scope,
               buttons: [
                  { text: 'ready',  onTap: function(e) { return true; } }
               ]
            }).then(function(response) {
                  $scope.handle_user_response(response);
            });

popup.close(true); // returns undefined is not a function

• and this example from https://github.com/driftyco/ionic/blob/dc2b24ed6aa14f7db6c70791c16c5afc5e909c66/js/ext/angular/src/service/ionicPopup.js#L36 :

$ionicPopup.show({
              templateUrl: 'view/dialog/med_reminder.html',
              title: 'Enter Wi-Fi Password',
              subTitle: 'Please use normal things',
              scope: self.root_scope,
              buttons: [
                { text: 'Cancel', onTap: function(e) { return false; } },
                {
                  text: '<b>Save</b>',
                  type: 'button-positive',
                  onTap: function(e) {
                    return true;
                  }
                },
              ]
            }).then(function(res) {
              console.log('Tapped!', res);
            }, function(err) {
              console.log('Err:', err);
            }, function(popup) {
              // If you need to access the popup directly, do it in the notify method
              // This is also where you can programatically close the popup:
              popup.close();
            });

Here the last function where the popup.close() is. Is never fired.

Am I missing something or has this function been removed from the new nightlies?

Thanks in advance

[stefanKuijers]

PS: tried last beta (Cadnium Camel) as well with same results

[ajoslin]

You can't use .then on the popup object we give back to you, or it will return a new promise without the close method on it.

This is how it should be done:

var popup = $ionicPopup.show(..);
popup.then(...);
popup.close();

[ajoslin]

This should probably be clarified more in the docs.

[stefanKuijers]

@ajoslin thanks man! That fixed it.
It's certainly clear now :)

[jdnichollsc]

Close only works with $ionicPopup.alert :(

[onderceylan]

I wanted to close all the popups before leaving the screen. This is how I did it.

export class PopupService {

        public popups: ionic.popup.IonicPopupPromise[] = [];

        constructor(public $ionicPopup: ionic.popup.IonicPopupService,
                    public $rootScope: ng.IRootScopeService) {

            $rootScope.$on('$ionicView.beforeLeave', () => {
                this.hideAllPopups();
            });
        }

        public show(object: ionic.popup.IonicPopupFullOptions): ionic.popup.IonicPopupPromise {
            let newPopup: ionic.popup.IonicPopupPromise = this.$ionicPopup.show(object);
            this.popups.push(newPopup);
            return newPopup;
        }

        public hideAllPopups(): void {
            this.popups.forEach((popup: ionic.popup.IonicPopupPromise) => {
                popup.close();
            });

            this.popups = [];
        }
    }