Angular Modal Service不会自行清理

时间:2016-05-24 14:12:11

标签: angularjs

我使用Angular Modal Service来显示模态。在我的情况下,模态本身并没有清理。运行模态时的含义,模态HTML保留在DOM中。我已经看过没有发生这种情况的例子,为什么会出现在我的例子中?

以下是示例的小提琴:http://jsfiddle.net/Ljo6ct4e/1/

这是我的JS:

的Javascript

var app = angular.module('app', ['angularModalService']);

app.controller('Controller', function($scope, ModalService) {

    $scope.show = function() {
        ModalService.showModal({
            template: "<div class='modal fade'>" + 
            "   <div class='modal-dialog'>" +
            "      <div class='modal-content'>" +
            "         <button type='button' ng-click=" + "close('close')" +  "class='btn btn-default' data-dismiss='modal'>Close</button>" +
            "         <div class='modal-body'><p >this is a modal</p></div>" +
            "      </div>" + 
            "   </div>" + 
            "</div>",
            controller: "ModalController",
            controllerAs : "modal"
        }).then(function(modal) {
            modal.element.modal();
            modal.close.then(function(result) {
                $scope.message = "You said " + result;
            });
        });
    };

});

app.controller('ModalController', function($scope, close) {
 $scope.close = function(result) {
    close(result, 500); // close, but give 500ms for bootstrap to animate
 };

});

1 个答案:

答案 0 :(得分:0)

您的范围函数不应与服务具有相同的名称。将其重命名为$scope.closeModal。然后在ng-click中使用它(你的按钮html中也有语法错误)。然后使用bootstrap函数隐藏模态并调用close服务,结果为null。

这是工作小提琴:http://jsfiddle.net/Ljo6ct4e/2/