AngularJS学习笔记之依赖注入详解(2)

如果没有明确的声明,AngularJS会假定参数名称就是依赖的名称。因此,它会在内部调用函数对象的 toString() 方法,分析并提取出函数参数列表,然后通过 $injector 将这些参数注入进对象实例。注入的过程如下:

injector.invoke(function($http, greeter) {});

请注意,这个过程只适用于未经过压缩和混淆的代码,因为AngularJS需要原始未经压缩的参数列表来进行解析。有了这个根据参数名称进行推断的过程,参数顺序就没有什么重要的意义了,因为AngularJS会帮助我们把属性以正确的顺序注入进去。

显式注入声明

AngularJS提供了显式的方法来明确定义一个函数在被调用时需要用到的依赖关系。通过这种方法声明依赖,即使在源代码被压缩、参数名称发生改变的情况下依然能够正常工作。可以通过$inject 属性来实现显式注入声明的功能。函数对象的 $inject 属性是一个数组,数组元素的类型是字符串,它们的值就是需要被注入的服务的名称。

下面是示例代码:

var aControllerFactory = function aController($scope, greeter) { console.log("LOADED controller", greeter); // ……控制器 }; aControllerFactory.$inject = ['$scope', 'greeter']; // Greeter服务 console.log("greeter service"); } // 我们应用的控制器 angular.module('myApp', []) .controller('MyController', aControllerFactory) .factory('greeter', greeterService); // 获取注入器并创建一个新的作用域 var injector = angular.injector(['ng', 'myApp']), controller = injector.get('$controller'), rootScope = injector.get('$rootScope'), newScope = rootScope.$new(); // 调用控制器 controller('MyController', {$scope: newScope});

对于这种声明方式来讲,参数顺序是非常重要的,因为 $inject 数组元素的顺序必须和注入参数的顺序一一对应。这种声明方式可以在压缩后的代码中运行,因为声明的相关信息已经和函数本身绑定在一起了。

行内注入声明

AngularJS提供的注入声明的最后一种方式,是可以随时使用的行内注入声明。这种方式其实是一个语法糖,它同前面提到的通过 $inject 属性进行注入声明的原理是完全一样的,但允许我们在函数定义时从行内将参数传入。此外,它可以避免在定义过程中使用临时变量。

在定义一个AngularJS的对象时,行内声明的方式允许我们直接传入一个参数数组而不是一个函数。数组的元素是字符串,它们代表的是可以被注入到对象中的依赖的名字,最后一个参数就是依赖注入的目标函数对象本身。

示例如下:

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

由于需要处理的是一个字符串组成的列表,行内注入声明也可以在压缩后的代码中正常运行。通常通过括号和声明数组的 [] 符号来使用它。

以上这篇AngularJS 依赖注入就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wzpffw.html