how to disable hide of pop-over when click outside?

Question

how to disable hide of pop-over when click outside?

I would like to know how to prevent the hiding of pop-over when it is clicked from the outside? On click, the pop-over is displayed. I need to prevent it from hiding after that. When I click outside the pop over, my pop-over hides. Is there a way to prevent this?

Codepen URL: http://codepen.io/anon/pen/WvYwqZ

$ionicPopover.fromTemplateUrl('my-popover.html', {
    scope: $scope
  }).then(function(popover) {
    $scope.popover = popover;
  });


  $scope.openPopover = function($event) {
    $scope.popover.show($event);
  };
  $scope.closePopover = function() {
    $scope.popover.hide();
  };

javascript
angularjs
ionic-framework

Answer 1

You have to add backdropClickToClose configuration.

angular.module('ionicApp', ['ionic'])

.controller('AppCtrl', function($scope, $ionicPopover) {
$ionicPopover.fromTemplateUrl('my-popover.html', {
    scope: $scope,
    "backdropClickToClose" :false
  }).then(function(popover) {
    $scope.popover = popover;
  });


  $scope.openPopover = function($event) {
    $scope.popover.show($event);
  };
  $scope.closePopover = function() {
    console.log("d");
    $scope.popover.hide();
  };


});

http://codepen.io/anon/pen/aOQZox