Question

我正在尝试创建一个可重用的ModalInstanceCtrl，我可以在其中传递自定义确定和取消功能以及任何自定义数据。我能够传递值不是函数的参数。

在当前的控制器中

 $scope.showInterest = function(jobId) {

     var params = {
         animation: true,
         templateUrl: 'show-insert-modal.php',
         controller: 'ModalInstanceCtrl',
         size: 'sm',
         resolve: {
             params: function() {
                 var params = {
                     // included in params OK
                     modalName: 'showInterest', 
                     jobId: jobId,
                     title: 'Show Interest',

                     //Not included in params
                     cancel: function() {
                         modalInstance.dismiss();
                     },
                     ok: function($modalScope) {
                         $modalScope.isSaving = true;
                         // some promise to run then
                         modalInstance.close()
                     }
                 };
                 return params;
             }
         }
     };


     var modalInstance = $modal.open(params);
 }

ModalInstanceCtrl

app.controller('ModalInstanceCtrl', ['$scope', '$modalInstance', 'params',

    function($scope, $modalInstance, params) {


        function cancel(reason) {
            params.cancel(reason);
        }

        function ok() {
            //TypeError: params.ok is not a function
            params.ok($scope);
        };

        // properties with functions are not part of the params variable
        //console.log(params) = Object {modalName: "showInterest", jobId: 1907, title: "Show Interest"} 
        console.log(params);

        var scope = {
            isSaving: false,
            params: params,
            ok: ok,
            cancel: cancel
        };
        angular.extend($scope, scope);

    }
]);

Answer 1

您可以使用结果承诺来调用您的方法。以下是一个基本示例：

crntPopup = $modal.open( tmpl )
crntPopup.result.then( function(){ yourCloseCallback()})
crntPopup.result.catch( function(){ yourDismissCallback()})

来自模态文档（https://angular-ui.github.io/bootstrap/#/modal）：

open方法返回一个模态实例，一个具有以下属性的对象：


close（result） - 一种可用于关闭模态，传递结果的方法

dismiss（reason） - 一种可用于解除模态，传递理由的方法

结果 - 在关闭模式时解决的承诺，在解除模式时拒绝

已打开 - 在下载内容模板并解析所有变量后打开模态时解决的承诺

呈现 - 呈现模式时解析的承诺。

Angular Boostrap UI Modal将自定义关闭和解除函数传递给ModalInstanceCtrl？

1 个答案: