我的 Angularjs 缩小错误在哪里？错误 $injector答案

【问题标题】：Where is my Angularjs minify error? Error $injector我的 Angularjs 缩小错误在哪里？错误 $injector
【发布时间】：2015-05-08 15:23:39
【问题描述】：

我遇到了恼人的 Angular 缩小问题（我真的希望这个问题在 Angular 2 中不存在）

我已经注释掉了我所有的应用程序模块注入，并逐个列出了问题所在，我认为我将其范围缩小到了我的 searchPopoverDirectives：

你能看出我做错了什么吗？

原始代码，产生this errorUnknown provider: eProvider <- e：

(function() { "use strict";

    var app = angular.module('searchPopoverDirectives', [])

    .directive('searchPopover', function() {
        return {
            templateUrl : "popovers/searchPopover/searchPopover.html",
            restrict    : "E",
            scope       : false,
            controller  : function($scope) {

                // Init SearchPopover scope:
                // -------------------------
                var vs = $scope;
                vs.searchPopoverDisplay = false;

            }
        }
    })

})();

然后我尝试了[] 语法以尝试解决缩小问题并遇到this error Unknown provider: $scopeProvider <- $scope <- searchPopoverDirective：

(function() { "use strict";

    var app = angular.module('searchPopoverDirectives', [])

    .directive('searchPopover', ['$scope', function($scope) {
        return {
            templateUrl : "popovers/searchPopover/searchPopover.html",
            restrict    : "E",
            scope       : false,
            controller  : function($scope) {

                // Init SearchPopover scope:
                // -------------------------
                var vs = $scope;
                vs.searchPopoverDisplay = false;

            }
        }
    }])

})();

更新： 还发现这个人造成了问题：

.directive('focusMe', function($timeout, $parse) {
    return {
        link: function(scope, element, attrs) {
            var model = $parse(attrs.focusMe);
            scope.$watch(model, function(value) {
                if (value === true) { 
                    $timeout(function() {
                        element[0].focus(); 
                    });
                }
            });
            element.bind('blur', function() {
                scope.$apply(model.assign(scope, false));
            })
        }
    }
})

【问题讨论】：

你在错误的地方尝试了 [] 语法 :-) 将它从指令（你不依赖的地方）移动到控制器函数
on update：在这里你的指令解决方案应该可以工作:-)
我在缩小之前使用 ng-annotate (github.com/olov/ng-annotate)。它会自动执行此操作。

标签： javascript angularjs minify angularjs-injector

【解决方案1】：

当你缩小代码时，它会缩小所有代码，所以你的

controller  : function($scope) {

被缩小到像

controller  : function(e) {

所以，请使用

controller  : ["$scope", function($scope) { ... }]

【讨论】：

啊，谢谢！是的..这个错误真的让我发疯了！我需要记住尽可能多地保持最小化......只会让调试变得困难:(
@LeonGaban 你只需要记住A note on minification：使用内联注释，而不是仅仅提供函数，你提供一个数组。

【解决方案2】：

缩小 javascript 时，参数名称会更改，但字符串保持不变。您有两种方法可以定义需要注入的服务：

内联注释：

phonecatApp.controller('PhoneListCtrl', ['$scope', '$http', function($scope, $http){
    ...
}]);

使用$inject 属性：

phonecatApp.controller('PhoneListCtrl', PhoneListCtrl);

PhoneListCtrl.$inject = ['$scope', '$http'];

function PhoneListCtrl($scope, $http){
    ...
}

使用$inject 被认为比内联注释更具可读性。最佳实践是始终有一行声明controller、service 或directive，一行定义注入值，最后是实现方法。由于 javascript 的提升特性，该方法可能最后定义。

记住：注解（字符串）和函数参数的顺序必须一致！

【讨论】：