从工厂打电话时如何从控制器关闭角带模式

时间:2017-06-21 09:39:43

标签: javascript angularjs angular-strap

好吧,所以我看到很多人都在努力从控制器上关闭角度模式。我得到了一些答案,但实际上他们做的不同(我不想改变代码风格)。我使用我的modalFactory打开模态,所以我没有modalInstance。所以我很不确定,我怎么能关闭它。

使用angular-bootstrap,我知道我可以注入uibModalInstance并调用uibModalInstance.dismiss()来关闭该函数。但是我怎么能用棱角分明模态来做类似的事情。

这是我的工厂:

(function (app) {
'use strict'

app.factory('modalFactory', ['$modal', function ($modal) {

    var local = this;
    local.modalInstance = ['$scope',
        function ($scope) {
               $scope.myVar = "Some variable input ";
               $scope.closeModal = function(){
                 console.log("CLose function has been called..")
                 // How I can close this.
               }
        }];

    return {
        openMyModal: function (ip) {
            $modal({
                templateUrl: 'myModal.html',
                controller: local.modalInstance,
                size: 'lg',
                resolve: {
                    ip: function () {
                        return ip;
                    }
                }
            })
        }
    }
}])

})(应用程序);

完整的plunkr可用here

1 个答案:

答案 0 :(得分:2)

clodeModal 方法中调用$scope.$hide()

(function (app) {
    'use strict'

    app.factory('modalFactory', ['$modal', function ($modal) {

        var local = this;
        local.modalInstance = ['$scope',
            function ($scope) {
                   $scope.myVar = "Some variable input ";
                   $scope.closeModal = function(){
                     console.log("CLose function has been called..")
                     $scope.$hide();
                   }
            }];

        return {
            openMyModal: function (ip) {
                $modal({
                    templateUrl: 'myModal.html',
                    controller: local.modalInstance,
                    size: 'lg',
                    resolve: {
                        ip: function () {
                            return ip;
                        }
                    }
                })
            }
        }
    }])
})(app);

更新plunker:http://plnkr.co/edit/2FxoBzY0vQqdrxqptm6F?p=preview