详解Angularjs中的依赖注入


Posted in Javascript onMarch 11, 2016

一个对象通常有三种方式可以获得对其依赖的控制权:

  • 在内部创建依赖;
  • 通过全局变量进行引用;
  • 在需要的地方通过参数进行传递

依赖注入是通过第三种方式实现的。比如:

function SomeClass(greeter) {
this.greeter = greeter;
}
SomeClass.prototype.greetName = function(name) {
this.greeter.greet(name);
};

SomeClass能够在运行时访问到内部的greeter,但它并不关心如何获得对greeter的引用。
为了获得对greeter实例的引用,SomeClass的创建者会负责构造其依赖关系并传递进去。

基于以上原因,AngularJS使用$injetor(注入器服务)来管理依赖关系的查询和实例化。
事实上,$injetor负责实例化AngularJS中所有的组件,包括应用的模块、指令和控制器等。

例如下面这段代码。这是一个简单的应用,声明了一个模块和一个控制器:

angular.module('myApp', [])
.factory('greeter', function() {
return {
greet: function(msg) {alert(msg);}
}
})
.controller('MyController',
function($scope, greeter) {
$scope.sayHello = function() {
greeter.greet("Hello!");
};
});

当AngularJS实例化这个模块时,会查找greeter并自然而然地把对它的引用传递进去:

<div ng-app="myApp">
<div ng-controller="MyController">
<button ng-click="sayHello()">Hello</button>
</div>
</div>

而在内部,AngularJS的处理过程是下面这样的:

// 使用注入器加载应用
var injector = angular.injector(['ng', 'myApp']);
// 通过注入器加载$controller服务:var $controller = injector.get('$controller');
var scope = injector.get('$rootScope').$new();
// 加载控制器并传入一个作用域,同AngularJS在运行时做的一样
var MyController = $controller('MyController', {$scope: scope})

以上就是本文的全部内容,希望本文对大家学习Angularjs依赖注入有所帮助。

Javascript 相关文章推荐
js图片延迟技术一般的思路与示例
Mar 20 Javascript
jquery实现类似淘宝星星评分功能实例
Sep 12 Javascript
avalonjs制作响应式瀑布流特效
May 06 Javascript
使用jquery提交form表单并自定义action的方法
May 25 Javascript
JS遍历数组和对象的区别及递归遍历对象、数组、属性的方法详解
Jun 14 Javascript
jQuery基于排序功能实现上移、下移的方法
Nov 26 Javascript
js实现文字向上轮播功能
Jan 13 Javascript
Vue-Router实现页面正在加载特效方法示例
Feb 12 Javascript
jQuery Validate表单验证插件实现代码
Jun 08 jQuery
JavaScript插件Tab选项卡效果
Nov 14 Javascript
JS实现li标签的删除
Apr 12 Javascript
JS 获取文件后缀,判断文件类型(比如是否为图片格式)
May 09 Javascript
详解AngularJS过滤器的使用
Mar 11 #Javascript
javascript html5 canvas实现可拖动省份的中国地图
Mar 11 #Javascript
js仿百度登录页实现拖动窗口效果
Mar 11 #Javascript
基于jQuery日历插件制作日历
Mar 11 #Javascript
jQuery Html控件基本操作(日常收集整理)
Mar 11 #Javascript
JavaScript获取客户端IP的方法(新方法)
Mar 11 #Javascript
JavaScript高级程序设计(第三版)学习笔记6、7章
Mar 11 #Javascript
You might like
通用PHP动态生成静态HTML网页的代码
2010/03/04 PHP
php递归删除指定文件夹的方法小结
2015/04/20 PHP
php+ajax 实现输入读取数据库显示匹配信息
2015/10/08 PHP
PHP安全之register_globals的on和off的区别
2020/07/23 PHP
在线编辑器的实现原理(兼容IE和FireFox)
2007/03/09 Javascript
jquery ajax提交表单数据的两种实现方法
2010/04/29 Javascript
JavaScrip单线程引擎工作原理分析
2010/09/04 Javascript
JavaScript的document对象和window对象详解
2010/12/30 Javascript
基于jQuery的Tab选项框效果代码(插件)
2011/03/01 Javascript
重构Javascript代码示例(重构前后对比)
2013/01/23 Javascript
jQuery文件上传插件Uploadify使用指南
2014/06/05 Javascript
javascript动态控制服务器控件实例
2014/09/05 Javascript
js实现动画特效的文字链接鼠标悬停提示的方法
2015/03/02 Javascript
react-router中的属性详解
2017/06/01 Javascript
深入理解vue2.0路由如何配置问题
2017/07/18 Javascript
jQuery实现table中两列CheckBox只能选中一个的示例
2017/09/22 jQuery
详解VUE 数组更新
2017/12/16 Javascript
在Vue组件中获取全局的点击事件方法
2018/09/06 Javascript
微信小程序 确认框的实现(附代码)
2019/07/23 Javascript
wxpython学习笔记(推荐查看)
2014/06/09 Python
python实现搜索指定目录下文件及文件内搜索指定关键词的方法
2015/06/28 Python
python使用pycharm环境调用opencv库
2018/02/11 Python
Python代码缩进和测试模块示例详解
2018/05/07 Python
PyQt4编程之让状态栏显示信息的方法
2019/06/18 Python
python爬虫中多线程的使用详解
2019/09/23 Python
查看端口并杀进程python脚本代码
2019/12/17 Python
使用Keras实现Tensor的相乘和相加代码
2020/06/18 Python
opencv 形态学变换(开运算,闭运算,梯度运算)
2020/07/07 Python
python 对象真假值的实例(哪些视为False)
2020/12/11 Python
python 基于opencv实现高斯平滑
2020/12/18 Python
HTML5中判断用户是否正在浏览页面的方法
2014/05/03 HTML / CSS
婚假请假条怎么写
2014/04/10 职场文书
精神文明单位申报材料
2014/05/02 职场文书
教师节感恩老师演讲稿
2014/08/28 职场文书
学校运动会通讯稿
2015/07/18 职场文书