angular依赖注入

http://www.cooklife.cn/detail/54c33ea2c93620284e964b56#View


使用过java进行开发的人肯定知道大名鼎鼎的spring框架,对于spring的IOC肯定也有所了解,通过配置文件定义好bean之后,如果需要使用这些bean,不需要自己去实例化,而是跟spring这个大容器去要就行了。我们的angular框架也实现了这种机制。

思考一下,如果对象需要获得其对依赖的控制权,有哪几种方式?

1.在对象内部自行创建依赖的实例

2.将依赖定义为全局的,然后通过全局变量去引用

3.在需要的地方通过参数去传递

依赖注入就是通过第三种方式去实现的,通过依赖注入可以出去对依赖关系的硬编码。

我们先来看看一个实例,angular中如何使用依赖注入。


angular.module('test',[]).controller('TestController', function($scope, $location){

})
我们给模块注册一个控制器,控制器接受两个参数$scope以及$location,这两个参数是angular内置的服务,那么控制器被调用的时候这些服务是如何由谁注入进去的呢?


在angular通过$injector服务来管理依赖关系的查询和实例化。

推断式注入声明

在上面的例子中,没有任何声明,angularjs认为参数的名称就是依赖的名称,angular根据参数的名称在已注册的服务中进行查找,然后通过$injector将这些参数注入进实例对象

injector.invoke(function($scope, $location){})

因为此处是根据参数的名称进行注入的,因此参数的顺序没有关系。

但是在生产环境中,为了缩短网页的加载的时间,我们通常会将js文件进行压缩,参数的名字会被别名替代,这个时候根据参数名称就行注入就行不通了。

显示注入声明

通过显示的方法来明确定义函数的依赖关系,即使源代码被压缩了,也能够正常运行。通过$inject属性来显示的进行注入。函数对象的$inject属性是一个数组,其元素是字符串,其值为需要注入的服务名称。


angular.module('test',[]).controller('TestController', TestController);

function TestController($scope, $location){

}
TestController.$injector = ['$scope','$location']

行内注入声明


行内的注入声明其实和显示注入声明效果一样,只是在函数定义的时候从行内将参数传入,可以避免在使用过程中使用临时变量。


angular.module('test',[]).controller('TestController', ['$scope', '$location',function($scope, $location){

}])

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值