Javascript 在指令中使用$uibModalInstance

打开引导ui模式时，如果您更喜欢使用指令，而不是单独使用

模板URL

和

控制器

，那么如何在模式指令的控制器中访问

$uibModalInstance

，以关闭模式或执行任何需要执行的操作？另外，我们如何传递

项

，而不必将其作为属性添加到模板上

angular.module('myModule', ['ui.bootstrap'])
.directive('myDirective', ['$timeout', function ($timeout) {

    var controllerFn = ['$scope', '$uibModal', function ($scope, $uibModal) {

            $scope.names = ['Mario','Wario','Luigi'];

            $scope.openModal = function () {
                var modalInstance = $uibModal.open({
                    animation: true,
                    template: '<my-modal>',
                    size: 'lg',
                    resolve: {
                        items: function () {
                            return $scope.names;
                        }
                    }
                });
            };
        }];

    return {
        restrict: 'E',
        templateUrl: '/Folder/my-directive.html',
        controller: controllerFn,
        scope: {
        }
    };
}])
.directive('myModal', ['$timeout', function ($timeout) {

    var controllerFn = ['$scope', function ($scope) {
    }];

    return {
        restrict: 'E',
        templateUrl: '/Folder/my-modal.html',
        controller: controllerFn,
        scope: {
        }
    };
}]);

angular.module（'myModule'，['ui.bootstrap']））
.directive（'myDirective'，['$timeout'，函数（$timeout）{
var controllerFn=['$scope'，'$uibModal'，函数（$scope，$uibModal）{
$scope.names=['Mario'，'Wario'，'Luigi']；
$scope.openModal=函数（）{
var modalInstance=$uibModal.open({
动画：没错，
模板：“”，
尺寸：“lg”，
决心：{
项目：功能（）{
返回$scope.names；
}
}
});
};
}];
返回{
限制：'E'，
templateUrl:“/Folder/my directive.html”，
控制器：控制器，
范围：{
}
};
}])
.directive（'myModal'，['$timeout'，function（$timeout）{
var controllerFn=['$scope'，函数（$scope）{
}];
返回{
限制：'E'，
templateUrl:“/Folder/my modal.html”，
控制器：控制器，
范围：{
}
};
}]);

在指令的链接函数中，$uibModalInstance在作用域对象上可用。

在指令的链接函数中，$uibModalInstance在作用域对象上可用。

我使用类似的方法将参数发送到模态，将元素添加到数组并将其返回给指令

// Directive who open modal
.directive('myDirective', ['$timeout', function ($timeout) {
    var controllerFn = ['$scope', '$uibModal', function ($scope, $uibModal) {
        // Base array
        $scope.names = ['Mario','Wario','Luigi'];

        $scope.openModal = function () {
            // Modal instance
            var modalInstance = $uibModal.open({
                animation: true,
                template: '<my-modal>',
                size: 'lg',
                controller: 'myDirectiveModalCtrl',
                controllerAs: '$modalController',
                resolve: {
                    // Provide namesInModal as service to modal controller
                    namesInModal: function () {
                        return $scope.names;
                    }
                }
            });
            // When modal close, fetch parameter given
            modalInstance.result.then(function (namesFromModal) {               
                $scope.names = namesFromModal;
            }, function () {
                // $log.info('Modal dismissed at: ' + new Date());
            });     
        };

    }];
    return {
        restrict: 'E',
        templateUrl: '/Folder/my-directive.html',
        controller: controllerFn,
        scope: {
        }
    };
}])
// Modal controller 
.controller('myDirectiveModalCtrl', ['$uibModalInstance','namesInModal',
    function ($uibModalInstance, namesInModal) {
        // Use same name set in myDirective.controllerAs
        var $modalController = this;
        // Get provided parameter as service
        $modalController.names = namesInModal;
        // Add new element
        $modalController.names.push('peach');
        // Return modal variable when close
        $modalController.ok = function () {
            $uibModalInstance.close($modalController.names);
        };
        $modalController.cancel = function () {
            $uibModalInstance.dismiss('cancel');
        };  
    }
]);

//打开模式的指令
.directive（'myDirective'，['$timeout'，函数（$timeout）{
var controllerFn=['$scope'，'$uibModal'，函数（$scope，$uibModal）{
//基阵
$scope.names=['Mario'，'Wario'，'Luigi']；
$scope.openModal=函数（）{
//模态实例
var modalInstance=$uibModal.open({
动画：没错，
模板：“”，
尺寸：“lg”，
控制器：“myDirectiveModalCtrl”，
controllerAs:“$modalController”，
决心：{
//将namesInModal作为服务提供给modal控制器
namesInModal:函数（）{
返回$scope.names；
}
}
});
//模式关闭时，获取给定的参数
然后（函数（namesFromModal）{
$scope.names=namesFromModal；
}，函数（）{
//$log.info（'Modal disposed at:'+new Date（））；
});     
};
}];
返回{
限制：'E'，
templateUrl:“/Folder/my directive.html”，
控制器：控制器，
范围：{
}
};
}])
//模态控制器
.controller（'myDirectiveModalCtrl'，['$uibModalInstance'，'namesInModal'，
函数（$uibModalInstance，namesInModal）{
//使用myDirective.controllerAs中设置的相同名称
var$modalController=this；
//获取作为服务提供的参数
$modalController.names=namesInModal；
//添加新元素
$modalController.names.push（'peach'）；
//关闭时返回模态变量
$modalController.ok=函数（）{
$uibModalInstance.close（$modalController.names）；
};
$modalController.cancel=函数（）{
$uibModalInstance.discover（'cancel'）；
};  
}
]);

我使用类似的方法将参数发送到modal，向数组中添加一个元素并将其返回给指令

// Directive who open modal
.directive('myDirective', ['$timeout', function ($timeout) {
    var controllerFn = ['$scope', '$uibModal', function ($scope, $uibModal) {
        // Base array
        $scope.names = ['Mario','Wario','Luigi'];

        $scope.openModal = function () {
            // Modal instance
            var modalInstance = $uibModal.open({
                animation: true,
                template: '<my-modal>',
                size: 'lg',
                controller: 'myDirectiveModalCtrl',
                controllerAs: '$modalController',
                resolve: {
                    // Provide namesInModal as service to modal controller
                    namesInModal: function () {
                        return $scope.names;
                    }
                }
            });
            // When modal close, fetch parameter given
            modalInstance.result.then(function (namesFromModal) {               
                $scope.names = namesFromModal;
            }, function () {
                // $log.info('Modal dismissed at: ' + new Date());
            });     
        };

    }];
    return {
        restrict: 'E',
        templateUrl: '/Folder/my-directive.html',
        controller: controllerFn,
        scope: {
        }
    };
}])
// Modal controller 
.controller('myDirectiveModalCtrl', ['$uibModalInstance','namesInModal',
    function ($uibModalInstance, namesInModal) {
        // Use same name set in myDirective.controllerAs
        var $modalController = this;
        // Get provided parameter as service
        $modalController.names = namesInModal;
        // Add new element
        $modalController.names.push('peach');
        // Return modal variable when close
        $modalController.ok = function () {
            $uibModalInstance.close($modalController.names);
        };
        $modalController.cancel = function () {
            $uibModalInstance.dismiss('cancel');
        };  
    }
]);

//打开模式的指令
.directive（'myDirective'，['$timeout'，函数（$timeout）{
var controllerFn=['$scope'，'$uibModal'，函数（$scope，$uibModal）{
//基阵
$scope.names=['Mario'，'Wario'，'Luigi']；
$scope.openModal=函数（）{
//模态实例
var modalInstance=$uibModal.open({
动画：没错，
模板：“”，
尺寸：“lg”，
控制器：“myDirectiveModalCtrl”，
controllerAs:“$modalController”，
决心：{
//将namesInModal作为服务提供给modal控制器
namesInModal:函数（）{
返回$scope.names；
}
}
});
//模式关闭时，获取给定的参数
然后（函数（namesFromModal）{
$scope.names=namesFromModal；
}，函数（）{
//$log.info（'Modal disposed at:'+new Date（））；
});     
};
}];
返回{
限制：'E'，
templateUrl:“/Folder/my directive.html”，
控制器：控制器，
范围：{
}
};
}])
//模态控制器
.controller（'myDirectiveModalCtrl'，['$uibModalInstance'，'namesInModal'，
函数（$uibModalInstance，namesInModal）{
//使用myDirective.controllerAs中设置的相同名称
var$modalController=this；
//获取作为服务提供的参数
$modalController.names=namesInModal；
//添加新元素
$modalController.names.push（'peach'）；
//关闭时返回模态变量
$modalController.ok=函数（）{
$uibModalInstance.close（$modalController.names）；
};
$modalController.cancel=函数（）{
$uibModalInstance.discover（'cancel'）；
};  
}
]);

我的错误；我将其理解为“如何从w访问$uibModalInstance？”