在Angularjs中注入服务的正确方法是什么？

Question

我刚刚学习AngularJS，我发现了许多不同的方法来做同样的事情，我真的想知道哪个更好，为什么选择一个选项而不是另一个。

我见过控制器创造了两种方式：

app.controller('CustomersController', function ($scope, customersService) {});

和

app.controller('CustomersController', ['$scope', 'customersService', function ($scope, customersService) {}]);

显然，第二种方式是打字更多，但在第一种方式上使用这种方式有什么好处？

Answer 1

两者都可以正常工作，但只有第二种语法才能在代码缩小后才能工作。大多数JavaScript minifiers会重命名参数标识符，因此您的代码可能如下所示：

a.controller('CustomersController',function(b,c){});

如果发生这种情况，Angular将无法再确定需要注入哪些服务。但是，如果使用数组语法，您将得到如下所示的缩小代码：

a.controller('CustomersController',['$scope','customersService',function(b,c){}]);

在这种情况下，数组的最后一个元素用作控制器函数，所有先前的元素都是表示服务名称的字符串。该列表有效地应用于控制器功能，每个服务由缩小器选择的任意标识符标识。

Answer 2

任何一个都没问题，如果你计划缩小你的代码，第二个就会被建议，因为第一个会缩小到类似的东西：

app.controller('CustomersController', function (a, b) {});

由于依赖注入如何工作，这将无法工作，但第二个将成为：

app.controller('CustomersController', ['$scope', 'customersService', function (a, b) {}]);

哪个角度内部知道将$ scope放入a和customersService in for b。

Answer 3

使用第二种方法可以使用变量缩小代码。如果你不这样做：

['$scope', 'customersService', function ($scope, customersService) {}]

然后你的变量可能会缩小，这会破坏你的应用程序。