如何从外部控制器关闭Angular Modal

Question

I am using angular-modal-service to open a modal.

$scope.showLoader = function(message) {
    ModalService.showModal({
        templateUrl: "/templates/loader.html",
        controller: "ctrl",
        inputs: {
            message: "loading"
        }
    }).then(function(modal) {
        modal.close.then(function(result) {
            if (result) {
                // do something
            }
        });
    });
}

After I open this modal, I want to call a function to close it from the main controller

$scope.closeLoader = function() {
    // close the modal here
}

How can I do this?

Answer 1

You can assign the modal closing function to the $scope when the modal is completely loaded. I added a dummy function, that it won't execute undefined if the modal is closed, before it is ready. You can also skip that, if you can assure, that it won't be possible.

$scope.closeLoader = angular.noop;

$scope.showLoader = function(message) {
    ModalService.showModal({
        templateUrl: "/templates/loader.html",
        controller: "ctrl",
        inputs: {
            message: "loading"
        }
    }).then(function(modal) {
        $scope.closeLoader = modal.close;
    });
};

Answer 2

Below is the code:

app.controller('MainController', function($scope, close) {

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

});

html

<button type="button" ng-click="close('No')" class="btn btn-default" data-dismiss="modal">No</button>