在自定義指令中調用服務

Question

我有一個自定義指令，該指令運行良好，直到我向它添加了一些服務，然后才給我一個“錯誤：ng：areq Bad Argument”，無法弄清原因。

我的指令：

angular.module('myApp')
    .directive('modalContent',[
        '$uibModal',
        'UserService'],
        function($uibModal, UserService){
        return {
            restrict: 'A',
            priority: 100,
            link: function($scope, element, attrs) {
                element.on( 'click', function( evt ){

                    console.log("Click and Stop");

                    evt.preventDefault()
                    evt.stopImmediatePropagation();

                    $scope.$apply(function(){
                        console.log("call Modal");
                    });

                });
            }
        };
    });

Answer 1

在創建指令之前，請嘗試初始化angular模塊：

angular.module('myApp',[]);

之后，您可以使用您的代碼。

---

編輯：

該錯誤是由於語法錯誤造成的，在'UserService'之后您有一個額外的] ，該指令的正確定義是：

angular.module('myApp')
    .directive('modalContent',[
        '$uibModal',
        'UserService',
        function($uibModal, UserService){
        return {
            restrict: 'A',
            priority: 100,
            link: function($scope, element, attrs) {
                element.on( 'click', function( evt ){

                    console.log("Click and Stop");

                    evt.preventDefault()
                    evt.stopImmediatePropagation();

                    $scope.$apply(function(){
                        console.log("call Modal");
                    });

                });
            }
        };
    }]);

還要注意最后的變化： }]); 代替});