控制器使用正常功能或数组表示法

Question

这两个有什么区别:

angular.module('myapp' ,[])
.controller('MyController', function($scope){...});

和

angular.module('myapp' ,[])
.controller('MyController, ['$scope', function($scope){...})];

对于像我这样刚接触AngularJS的人来说,这非常复杂.语法与Java和C的区别太大了.

非常感谢.

Answer 1

他们之间没什么区别.两个代码的工作方式相同.但是,如果你使用第一个代码,当你缩小代码时,它会混淆.

寻找一个例子:

.controller('MyController', function(a){...});//$scope is changed to a

并且您的代码将无法工作,因为angularjs代码使用$ scope变量,因为它不接受第一,第二,第三等参数.

因此,第二个代码比第一个代码更安全,就好像当你缩小代码时,它仍然需要相同的变量,即$ scope.

寻找一个例子:

.controller('MyController', ['$scope', function(a){...})];//a refers to $scope

因此,当您缩小代码时,上面的代码工作正常,因为$ scope被注入而不是a.因此,如果您传递多个参数,那么在此示例中排序很重要.请看以下内容:

.controller('MyController', ['$scope','$timeout', function(s,t){...})];s作为$ scope注入,t作为$ timeout注入.因此,如果你改变它们的顺序,['$timeout','$scope', function(s,t){...})]那么s是$ timeout,t是$ scope.因此,在这个示例中排序很重要,但在第一个示例中,代码排序无关紧要,因为名称很重要,例如$ scope,$ timeout.

如果您使用下面的第一个示例代码,还有另一种注入变量的方法:

MyController.$inject = ['$scope'];

对于多个参数,

MyController.$inject = ['$scope','$timeout'];

因此,主要有三种注释:

1. 隐式注释 - 您的第一个示例代码
2. $ inject属性注释 - $ inject方法
3. 内联数组注释 - 您的第二个示例代码

Answer 2

第二个是缩小安全。

由于 Angular 从控制器构造函数的参数名称推断控制器的依赖关系，因此如果要缩小 PhoneListCtrl 控制器的 JavaScript 代码，则其所有函数参数也将被缩小，并且依赖项注入器将无法识别服务正确。

来源