AngularJS - 依赖注入答案

【问题标题】：AngularJS - dependency injectionAngularJS - 依赖注入
【发布时间】：2014-02-17 09:23:00
【问题描述】：

我想知道下两行之间是否有区别，以及为什么要使用其中之一（两者按预期工作）

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

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

我从官方 AngularJS 教程中得到它，我知道有关于这个修改的解释，但我不明白...... http://docs.angularjs.org/tutorial/step_05

提前致谢！

【问题讨论】：

标签： angularjs dependency-injection

【解决方案1】：

如果你缩小你的第一行，你会得到：

phonecatApp.controller("PhoneListCtrl",function(e,t){})

然后依赖注入将不起作用，因为 Angular 不知道 e 和 t 是什么。将其与缩小第二个版本进行比较：

phonecatApp.controller("PhoneListCtrl",["$scope","$http",function(e,t){}])

函数参数仍被重命名，但$scope和$http在数组中给出，因此注入可以按预期进行。

【讨论】：

【解决方案2】：

在功能方面没有区别。如果您的代码被缩小，第一个可能会搞砸，因为角度从参数名称解析。后者具有某种防止缩小的保护，因为您已经在数组中传递依赖项。

【讨论】：

【解决方案3】：

AngularJS 通过注入器调用某些功能（如服务工厂和控制器）。您需要对这些函数进行注释，以便注入器知道要将哪些服务注入到函数中。使用服务名称信息注释代码的方法有以下三种：

使用内联数组注释（首选）
使用$inject 属性注释
从函数参数名称中隐含（有警告）

欲了解更多信息，请参阅AngularJS Developer Guide - Dependency Injection

【讨论】：