当你开始学习AngularJS的第一个特征时，你可能会遇到一种叫做依赖注入 (DI) 的东西: 前提是AngularJS在应用程序需要它们时注入依赖项。作为开发人员，我们的任务只是将依赖项传递给模块，其他一切都将由AngularJS照顾。现在，我可以向您展示如何使用市场上最好的Angular组件库之一轻松完成所有操作-用于Angular的Ignite UI。
要创建控制器，我们将 $ scope对象和其他依赖项传递给模块的控制器函数。例如，要创建ProductController，我们要传递 $ scope对象和计算器服务依赖项。这重申了一个知识，即作为开发人员，我们的工作是传递依赖项，AngularJS将在应用程序需要它们时注入它们。
从我们的角度来看，我们真的不关心AngularJS如何注入依赖-我们不需要知道注入过程如何工作来开发应用程序。但是，如果我们知道传递依赖关系的各种方法，那就更好了。在AngularJS中，依赖关系可以通过三种可能的方式传递。它们如下:
- 传递依赖项作为函数参数
- 传递依赖项作为数组参数
- 传递一个依赖使用 $ inject服务
让我们逐一探讨这些选项。
传递依赖项作为函数参数
也许你发现自己经常传递一个依赖作为函数参数，这是完全正常的。例如，我们传递一个 $ scope对象来创建一个控制器，如下面的清单所示:
app.controller( “ProductController”，函数 ($ scope) {$ scope.message =，“嘿，我被传递为函数参数”});
将依赖关系作为函数参数传递效果很好，直到我们使用应用程序的缩小版本在生产中部署应用程序。通常，为了提高性能，我们在生产中缩小应用程序，但是当我们缩小应用程序时，将依赖项作为函数参数传递会中断。
显然，在生产中，为了获得更好的性能，我们希望部署应用程序的缩小版本，但是应用程序会中断，因为参数名称将更改为较短的别名。为了避免生产中断，我们应该选择另一种选择。
传递依赖项作为数组参数
可能在AngularJS应用程序中传递依赖关系的最流行的方式是将它们作为数组参数传递。当我们将依赖项作为数组参数传递时，当我们缩小应用程序时，应用程序不会在生产中中断。我们可以通过两种可能的方式做到这一点:
- 使用命名函数
- 使用内联匿名函数
使用命名函数
我们可以将依赖关系作为数组参数与命名函数传递，如下面的清单所示:
var app = angular.mo dule( 'app', []);函数ProductController($ scope) {$ scope.greet = "Infragistics";};app.controller( 'ProductController', ['$ scope', ProductController]);
正如你会注意到的，我们在数组中传递了一个依赖 $ scope对象以及控制器函数的名称。可以传递多个依赖项，只要它们之间用逗号分隔即可。例如，我们可以将 $ http服务和 $ scope对象作为依赖项传递，如下面的清单所示:
var app = angular.mo dule( 'app', []);函数ProductController($ scope，$ http) {$ scope.greet = “api.com” $ http.get； };app.controller( 'ProductController', ['$ scope',' $ http', ProductController]);
正如我们前面所讨论的，当我们缩小应用程序时，将依赖项作为数组参数传递不会破坏应用程序。
使用内联匿名函数
就个人而言，我发现使用命名函数比使用内联匿名函数更方便。对我来说，管理命名控制器功能很容易。如果您更喜欢内联函数，则可以将依赖项作为数组参数传递，就像在命名控制器函数中传递它们一样。我们可以将内联函数中的依赖项作为数组参数传递，如下面的清单所示:
var app = angular.mo dule( 'app', []);app.controller( 'ProductController', ['$ scope',' $ http',function ($ scope,$ http) {$ scope.greet =，“Foo是伟大的!”}]);
请记住，即使我们缩小应用程序，作为数组参数注入的依赖关系也会起作用。
传递一个依赖使用 $ inject服务
还有一种方法可以在AngularJS中注入依赖项: 通过使用 $ 注入服务。在这样做时，我们手动注入依赖项。我们可以使用 $ inject服务注入 $ scope对象依赖项，如下面的清单所示:
函数ProductController($ scope){$ scope.greet =; "Foo不是很好!5"}ProductController.$ inject = ['$ scope' ];app.controller( 'ProductController', ProductController);
当我们缩小生产应用程序时，使用 $ inject服务也不会破坏应用程序。大多数情况下，我们会发现 $ inject服务用于在控制器的单元测试中注入依赖项。
在结束本文之前，让我们看看如何使用 $ inject在实时应用程序中向控制器注入服务。我们已经创建了一个服务，如下所示:
app.factory( “计算器”，函数 () { 返回 {添加: 函数 (a，b) { 返回a b；}}});
我们需要在CalController中使用计算器服务。可以创建CalController，如下面的列表所示:
app.controller( 'CalController', CalController);函数CalController($ scope，Calculator) {$ scope.result = 0；$ scope.add = 函数 () {“hi22” (警报)；$ scope.result = Calculator.add($ scope.num1, $ scope.num2);}};
此时，应用程序应该可以工作，因为依赖项是作为函数参数传递的。但是，当我们缩小它时，应用程序将会中断。因此，让我们继续使用 $ inject注入依赖项，如下面的清单所示:
CalController.$ inject = [' $ scope'，' 计算器 ' ]；
在视图上，可以使用控制器，如下所示:
< div ng-controller = "CalController" > <输入类型="数字"ng-型号="num1"占位符="输入数字1" /> <输入类型="数字"ng-型号="num2"占位符="输入数字2" /> <按钮ng-单击="添加 ()">添加</按钮>{{结果}} < /div>
在那里你有它-在AngularJS应用程序中插入依赖关系的最简单方法。
</p