Как я могу закрыть всплывающее окно, когда я нажимаю на фон в ионном режиме. Это мой код. Я новичок в ionic и angular js. Приведенный ниже код позволяет мне открывать всплывающее окно, и когда я нажимаю на кнопки, я закрыл всплывающее окно. Я хочу сделать так, чтобы при щелчке по фону я перешел на домашнюю страницу.

 $scope.showPopup = function() {
   $scope.data = {}
 // An elaborate, custom popup
 var myPopup = $ionicPopup.show({

 title: 'Social Media Services',

 scope: $scope,
 buttons: [
 { 
 type :'ion-social-facebook positive button-large',

     onTap: function(e) {
     // $cordovaSpinnerDialog.show("aaa", "aaaa");
        window.open('https://www.facebook.com/BinDawood.Co', '_system', 'location=yes');
     }
   },
   { type :'ion-social-twitter calm',
     onTap: function(e) {
     // $cordovaSpinnerDialog.show("aaa", "aaaa");
        window.open('https://twitter.com/BinDawoodco', '_system', 'location=yes');
     }
   },
   {  type :'ion-social-pinterest assertive',
     onTap: function(e) {
     // $cordovaSpinnerDialog.show("aaa", "aaaa");
         window.open('http://pinterest.com/bindawoodco', '_system', 'location=yes');
     }
   },

 ]
 });
 myPopup.then(function(res) {
  console.log('Tapped!', res);
 });

 };

Как я могу изменить свой код, чтобы это произошло?

6
Salman Ullah Khan 13 Фев 2015 в 12:43

2 ответа

Лучший ответ

Если вы хотите закрыть пользовательский интерфейс при нажатии на фон, используйте модальное окно вместо всплывающего окна. Надеюсь, это решит вашу проблему.

http://ionicframework.com/docs/api/service/ $ ionicModal /

4
Gopinath Shiva 13 Фев 2015 в 10:15

Иногда модальное окно - это не то, что нам нужно. Модальное окно займет весь экран на мобильных экранах.

Итак, я создал Сервис, чтобы можно было закрыть всплывающее окно, щелкнув фон, и сделал его доступным на Github: https://github.com/mvidailhet/ionic-close-popup

Чтобы упростить жизнь людям, которым нужна эта функция, я сделал ее доступной в реестре bower.

Установите его с помощью Bower:

$ bower install ionic-close-popup

Включите модуль ionic.closePopup в зависимости вашего приложения:

angular.module('app', ['ionic', 'ionic.closePopup'])

Зарегистрируйте вновь созданное всплывающее окно в сервисе closePopupService:

var alertPopup = $ionicPopup.alert({
  title: 'Alert popup',
  template: 'Tap outside it to close it'
});
IonicClosePopupService.register(alertPopup);

Вот Codepen, показывающий живой код: http://codepen.io/mvidailhet/pen/JYwYEE

5
Mitch 17 Ноя 2015 в 16:04