AngularJS 指令在缩小时失败

Question

我在 visual studio 上使用了一个压缩器插件，除了这一段 AngularJS 代码

这是未压缩的代码：

var svgBuildInterface = angular.module("svgBuildInterface", []);

svgBuildInterface.directive('ngRightClick', function ($parse) {
    return function (scope, element, attrs) {
        var fn = $parse(attrs.ngRightClick);
        element.bind('contextmenu', function (event) {
            scope.$apply(function () {
                event.preventDefault();
                fn(scope, { $event: event });
            });
        });
    };
});

这是打印精美的缩小代码，但失败了：

svgBuildInterface = angular.module("svgBuildInterface", []);
svgBuildInterface.directive("ngRightClick", function(n) {
    return function(t, i, r) {
        var u = n(r.ngRightClick);
        i.bind("contextmenu", function(n) {
            t.$apply(function() {
                n.preventDefault();
                u(t, {
                    $event: n
                })
            })
        })
    }
});

我无法在缩小的代码中放置一个断点来找出发生了什么，但是 angularJS 抛出一个异常：

Error: [$injector:unpr] http://errors.angularjs.org/1.5.7/
$injector/unpr?p0=nProvider%20%3C-%20n%20%3C-%20ngRightClickDirective

Answer 1

像下面这样更改您的指令，当您想要缩小 JS 时，在编写控制器或指令或 Angular js 的任何组件时要遵循某些最佳实践。

其中之一是通过 []

传递依赖注入

var svgBuildInterface = angular.module("svgBuildInterface", []);

svgBuildInterface.directive('ngRightClick',['$parse', function ($parse) {
    return function (scope, element, attrs) {
        var fn = $parse(attrs.ngRightClick);
        element.bind('contextmenu', function (event) {
            scope.$apply(function () {
                event.preventDefault();
                fn(scope, { $event: event });
            });
        });
    };
}]);

AngularJS 指令在缩小时失败

AngularJS directive fails when minified

angularjs

bundling-and-minification