当单击模态的外部时，防止关闭基础模态。

I don't want the modal to go away when I click on the background. I'd like it to keep display until I click the button inside the modal. Here is a codepen link

我不希望模式在我点击背景时消失。我希望它一直显示，直到我点击模态中的按钮。这是一个代码页链接

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

here is the angular code

这是角码

app = angular.module('app', ['ngAnimate']);
app.directive('modal', function() {
  return {
    restrict: 'E',
    scope: {
      show: '='
    },
    replace: true, // Replace with the template below
    transclude: true, // we want to insert custom content inside the directive
    link: function(scope, element, attrs) {
      scope.hideModal = function() {
        scope.show = false;
      };
    },
    template: "<div class='ng-modal' ng-show='show'>"+
                "<div class='reveal-modal' data-options='close_on_background_click:false' ng-show='show'>"+
                  "<div ng-transclude></div>"+
                  "<a class='close-reveal-modal' ng-click='hideModal()'>&#215;</a>"+
                "</div>"+
                "<div class='reveal-modal-bg' ng-click='hideModal()'></div>"+
              "</div>"
  };
});

app.controller('AppCtrl', ['$scope', function($scope) {
  $scope.modalShown = false;
  $scope.toggleModal = function() {
    $scope.modalShown = !$scope.modalShown;
  };
}]);

1 个解决方案

#1

Finally found the solution that works. I added

最后找到了可行的解决方案。我添加了

backdrop : 'static'

into $modal.open

成美元modal.open

#1