我想了解声明MyOtherService和之间的区别MyOtherComplexService.特别是方括号部分的目的是什么？何时使用它们何时不使用？
var myapp = angular.module('myapp', []);
myapp.factory('MyService', function($rootScope, $timeout) {
return {
foo: function() {
return "MyService";
}
}
});
myapp.factory('MyOtherService', function($rootScope, $timeout, MyService) {
return {
foo: function() {
return "MyOtherService";
}
}
});
myapp.factory('MyOtherComplexService', ['$rootScope', '$timeout', 'MyService', function($rootScope, $timeout, MyService) {
return {
foo: function() {
return "MyOtherComplexService";
}
}
}]);
myapp.controller('MyController', function($scope, MyOtherService, MyOtherComplexService) {
$scope.x = MyOtherService.foo();
$scope.y = MyOtherComplexService.foo();
});
Ufuk Hacıoğu.. 34
它使AngularJS代码缩小.AngularJS使用参数名称将值注入控制器函数.在JavaScript缩小过程中,这些参数将重命名为较短的字符串.通过告诉使用字符串数组向函数注入哪些参数,AngularJS仍然可以在重命名参数时注入正确的值.
它使AngularJS代码缩小.AngularJS使用参数名称将值注入控制器函数.在JavaScript缩小过程中,这些参数将重命名为较短的字符串.通过告诉使用字符串数组向函数注入哪些参数,AngularJS仍然可以在重命名参数时注入正确的值.
添加到Ufuk的答案:
Angular的最小安全方括号表示法不太方便,因为您必须键入每个依赖项两次并且参数顺序很重要.有一个名为ngmin的工具可以将标准模块编译为最小安全模块,因此您无需手动管理所有这些操作.
如果您使用CoffeeScript,情况会更糟.您可以在ngmin之间进行选择,这会破坏您的源地图,或者如果您想自己写出来,则必须用方括号包装整个代码,这非常难看.
angular.module('whatever').controller 'MyCtrl', ['$scope', '$http' , ($scope, $http) ->
# wrapped code
]
在我看来,这不是CoffeeScript的缺陷,而是Angular团队的糟糕设计决策,因为它违背了所有JS/CoffeeScript约定而不是将函数作为最后一个参数.足够的咆哮,这是一个小帮手功能来解决它:
deps = (deps, fn) -> deps.push fn deps
这是一个非常简单的函数,它接受两个参数.第一个是包含依赖项的字符串数组,第二个是模块的函数.您可以像这样使用它:
angular.module('whatever').controller 'MyCtrl', deps ['$scope', '$http'] , ($scope, $http) ->
# unwrapped code \o/
只是为了举例说明已经说过的内容,如果使用以下语法:
myapp.factory('MyService', function($scope, $http, MyService) { ... });
大多数JS minifiers会将其改为:
myapp.factory('MyService', function(a, b, c) { ... });
因为函数参数名称通常可以重命名为较短的名称.这将打破Angular代码.
在Angular中,为了使代码在所有minifiers中都可以缩小,可以使用括号语法:
myapp.factory('MyService', ['$scope', '$http', 'MyService', function($scope, $http, MyService) { ... }]);
将被缩小为:
myapp.factory('MyService', ['$scope', '$http', 'MyService', function(a, b, c) { ... }]);
请注意,缩小器不会触及字符串,因此Angular将按顺序查看缩小的代码和匹配参数:
$scope = a $http = b MyService = c
要避免这种丑陋的方括号语法,您应该使用像ng-annotate这样的智能缩小器.
京公网安备 11010802040832号 | 京ICP备19059560号-6 