时间戳

首页 > 解决方案 > 从 ui bootstrap modal 控制器调用函数

javascript - 从 ui bootstrap modal 控制器调用函数

问题描述

我有一个使用自己的新控制器打开的模态，我想从模态控制器调用一个函数，但该函数是在父控制器中定义的。

我将这个函数定义为从 $rootScope 调用，这是从模态中的父级调用函数的最佳方式还是将来有意义？

例子：

  FormModule.controller("formCtrl", function ($scope, $http, $uibModal, $log, $rootScope) {

        $rootScope.ShowReport = function ShowReport() {

        //function Edit
        $scope.edit = function () {
            var ObjResolve = function () {
                return obj;
            }
            var modalInstance=  $uibModal.open({
                animation: true,
                templateUrl: 'Modal.html',
                controller: 'ModalInstanceCtrl',
                resolve: {
                    ObjResolve
                }
            }).result.catch(function (res) {
                if (!(res === 'cancel' || res === 'escape key press')) {
                    //throw res;
                }
            });
        };

    });
 FormModule.controller("ModalInstanceCtrl", function ($scope, $uibModal, $uibModalInstance, $http, ObjResolve, $rootScope ) {

        //save Event
        $scope.save = function () {
         $rootScope.ShowReport();
        }


    });

标签： javascriptangularjsangular-ui-bootstrap

解决方案

您可以使用 modalInstance 回调，当 modal 关闭时调用

$scope.edit = function () {
 var ObjResolve = function () {
   return obj;
 }
 var modalInstance=  $uibModal.open({
        animation: true,
        templateUrl: 'Modal.html',
        controller: 'ModalInstanceCtrl',
        resolve: {
        ObjResolve
        }
    }).result.catch(function (res) {
     if (!(res === 'cancel' || res === 'escape key press')) {//throw res;}
    });
    modalInstance.result.then(function(){
        ShowReport() //call function when modal is closed
    })
 };

模态控制器

FormModule.controller("ModalInstanceCtrl", function ($scope, $uibModal, $uibModalInstance, $http, ObjResolve, $rootScope ) {

            //save Event
            $scope.save = function () {
             $uibModalInstance.close();
            }
    })

推荐阅读