angularjs - 指令内不能 $uibModal 但可以在 Controller 中访问

Question

我想指示打开一个模式。但是 $uibModal 没有在指令中定义。

var app=angular.module("app",['ui.bootstrap']);

app.controller('AppCtrl', function ($scope, $uibModal) {
    console.log("$uibModal controller",$uibModal);//getting object
});

app.directive('showPopUp',function() {
    return {
        restrict: 'EA',
        link: function(scope, el, attrs,$uibModal) {
            console.log("$uibModal",$uibModal);//undefined here
                var modalInstance = $uibModal.open({
                  animation: $scope.animationsEnabled,
                  templateUrl: 'popup.html',
                });

                modalInstance.result.then(function (selectedItem) {
                  scope.selected = selectedItem;
                }, function () {
                });

        }  
    }
});

如何在我的指令中使用 $uibModal 打开 modal ？

Answer 1

指令链接函数是不可注入(inject)的，它以固定的顺序采用固定的参数集。但是您可以将服务注入(inject)指令函数本身:

app.directive('showPopUp', function($uibModal) {
    return {
        restrict: 'EA',
        link: function(scope, el, attrs) {

            var modalInstance = $uibModal.open({
                animation: scope.animationsEnabled,
                templateUrl: 'popup.html',
            });

            modalInstance.result.then(function(selectedItem) {
                scope.selected = selectedItem;
            }, function() {});

        }
    }
});

演示: http://plnkr.co/edit/jwNOM94DtyRIXTdhvJmy?p=preview