javascript - 指令中的 Angular Controller 导致严格的 di 错误

Question

我在我的应用程序中使用 ng-strict-di mod。它适用于我的所有 DI，除非我尝试在指令中使用 Controller 。仅供引用，我使用 John Papa 风格指南来格式化我的代码。

这是我的指令:

(function () {
    'use strict';

    angular
        .module('app.mymodule')
        .directive('myDirective', myDirective);

    myDirective.$inject = [];

    function  myDirective() {
        var directive = {
            bindToController: true,
            controller: MyDirectiveCtrl,
            controllerAs: 'vm',
            restrict: 'E',
            scope: {
                data:'='
            },   
            templateUrl: 'my-directive-template.html',  
        };
        return directive;

        MyDirectiveCtrl.$inject = ['ServiceSvc'];
        function MyDirectiveCtrl(ServiceSvc) {
            var vm = this;

            vm.foo = foo;

            function foo() {
                ServiceSvc.bar();
            }
        }
    }
})();

因此，我在 MyDirectiveCtrl 中显式注入(inject)了 ServiceSvc，但在 Chrom 控制台中，我收到了有关严格 DI 的错误:

Error: [$injector:strictdi] MyDirectiveCtrl is not using explicit annotation and cannot be invoked in strict mode
http://errors.angularjs.org/1.4.3/$injector/strictdi?p0=MyDirectiveCtrl 
    at vendor.js:10
    at Function.annotate [as $$annotate] (vendor.js:209)
    at Object.invoke (vendor.js:233)
    at extend.instance (vendor.js:443)
    at nodeLinkFn (vendor.js:374)
    at vendor.js:397
    at processQueue (vendor.js:703)
    at vendor.js:704
    at Scope.$eval (vendor.js:748)
    at Scope.$digest (vendor.js:743)

知道为什么我会收到此错误吗？

Answer 1

我认为你必须使用外部指令中定义的 Controller ，如下所示

 angular
        .module('app.mymodule')
        .directive('myDirective', myDirective);

myDirective.$inject = [];

function  kissNotificationList() {
    var directive = {
        bindToController: true,
        controller: MyDirectiveCtrl,
        controllerAs: 'vm',
        restrict: 'E',
        scope: {
            data:'='
        },   
        templateUrl: 'my-directive-template.html',  
    };
    return directive;


}

//direcitves controller

 MyDirectiveCtrl.$inject = ['ServiceSvc'];

 function MyDirectiveCtrl(ServiceSvc) {
        var vm = this;

        vm.foo = foo;

        function foo() {
            ServiceSvc.bar();
        }
    }