AngularJS ControllerAs语法和控制器注入变量

Question

我正在撰写指令并试图坚持John Papa style guide。所以我也决定跳上ControllerAs语法旅行车，我有一个小指令如下：

(function() {
    angular
        .module('htApp')
        .directive('newsletterSignup', newsletter_signup);

    function newsletter_signup($http) {
        var directive = {
            templateUrl: '../whatever.tpl.html',
            restrict: 'EA',
            controller : controller,
            controllerAs: 'vm',
            bindToController: true
        };

        return directive;

        controller.$inject = ['$http'];

        function controller($http) {
            var vm = this;
            // $http is here ... all is good, but I don't need it

            function doSubmit(form) {
                // I need $http here, but it is null
                debugger;
            };

            vm.doSubmit = doSubmit;
        }
    }
})();

这是一个简报注册服务。我将不得不做一个HTTP请求，因此我将它注入控制器。一切都很好 - 但是从模板中调用vm.doSubmit(--formname-here--)函数会导致我无法找到$http服务。

所以我的问题是：如何从$http函数访问注入的doSubmit()？

修改

我将包含视图代码 - 但不用担心 - 管道工程：

<button class="btn btn-yellow" ng-click="vm.doSubmit(newsletterform)" translate>
    footer.ok_button_text
</button>

编辑2

事实证明，@ Teek是对的 - 代码有效。我认为我没有看到它的原因是因为（我认为）当Chrome知道它不会被调用时，Chrome中的JS运行时会优化$http。

此代码工作正常。我认为这是因为运行时在$http函数调用中预计会使用console.log()。但是 - 如果我删除该行，我会得到这个（这就是为什么我首先遇到这个问题）：

请注意，我注释了console.log - 因此doSubmit()来电永远不会使用$http。现在 - 当我在控制台中调用$http时 - 它没有被定义。

Answer 1

问题在于：

return directive;

controller.$inject = ['$http'];

function controller($http) {
...

执行controller语句时定义了

return函数。但永远不会定义controller.$inject。此外，newsletter_signup函数错过了相应的$inject。

This不会minified正确。虽然this为minified。