详解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 相关文章推荐
向fckeditor编辑器插入指定代码的方法
May 25 Javascript
js 鼠标拖动对象 可让任何div实现拖动效果
Nov 09 Javascript
JavaScript.The.Good.Parts阅读笔记(一)假值与===运算符
Nov 16 Javascript
一个js控制的导航菜单实例代码
Dec 03 Javascript
简单谈谈Vue 模板各类数据绑定
Sep 25 Javascript
jQuery tagsinput在h5邮件客户端中应用详解
Sep 26 Javascript
完美解决IE9浏览器出现的对象未定义问题
Sep 29 Javascript
基于Bootstrap 3 JQuery及RegExp的表单验证功能
Feb 16 Javascript
js return返回多个值,通过对象的属性访问方法
Feb 21 Javascript
详解使用React.memo()来优化函数组件的性能
Mar 19 Javascript
vue中改变滚动条样式的方法
Mar 03 Javascript
vue+elementUI(el-upload)图片压缩,默认同比例压缩操作
Aug 10 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获取文件的MD5值并判断是否被修改的例子
2014/06/19 PHP
PHP添加文字水印或图片水印的水印类完整源代码与使用示例
2019/03/18 PHP
php 多进程编程父进程的阻塞与非阻塞实例分析
2020/02/22 PHP
PHP7 参数处理机制修改
2021/03/09 PHP
用jquery实现的模拟QQ邮箱里的收件人选取及其他效果(一)
2011/01/06 Javascript
jquery自动填充勾选框即把勾选框打上true
2014/03/24 Javascript
jQuery基于图层模仿五星星评价功能的方法
2015/05/07 Javascript
使用AngularJS编写较为优美的JavaScript代码指南
2015/06/19 Javascript
js如何判断是否在iframe中及防止网页被别站用iframe嵌套
2017/01/11 Javascript
vuejs2.0实现分页组件使用$emit进行事件监听数据传递的方法
2017/02/22 Javascript
在Node.js中将SVG图像转换为PNG,JPEG,TIFF,WEBP和HEIF格式的方法
2019/08/22 Javascript
layui清空,重置表单数据的实例
2019/09/12 Javascript
[05:20]卡尔工作室_DOTA2新手教学_DOTA2超强新手功能
2013/04/22 DOTA
[01:59]DOTA2首部纪录片《Free to play》预告片
2014/03/12 DOTA
[33:23]VG vs Pain 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
使用Python编写一个简单的tic-tac-toe游戏的教程
2015/04/16 Python
Windows上配置Emacs来开发Python及用Python扩展Emacs
2015/11/20 Python
Python爬虫之模拟知乎登录的方法教程
2017/05/25 Python
使用pandas将numpy中的数组数据保存到csv文件的方法
2018/06/14 Python
tensorflow 打印内存中的变量方法
2018/07/30 Python
Python中面向对象你应该知道的一下知识
2019/07/10 Python
cProfile Python性能分析工具使用详解
2019/07/22 Python
在django中实现页面倒数几秒后自动跳转的例子
2019/08/16 Python
浅谈Django2.0 加xadmin踩的坑
2019/11/15 Python
用Python爬取LOL所有的英雄信息以及英雄皮肤的示例代码
2020/07/13 Python
python绘图模块之利用turtle画图
2021/02/12 Python
Omio波兰:全欧洲低价大巴、火车和航班搜索和比价
2018/02/16 全球购物
银河香水:Galaxy Perfume
2019/03/25 全球购物
法学个人求职信范文
2014/01/27 职场文书
大学生就业推荐表自我评价
2015/03/02 职场文书
红色经典观后感
2015/06/18 职场文书
《最后一头战象》教学反思
2016/02/16 职场文书
Nginx+Tomcat实现负载均衡、动静分离的原理解析
2021/03/31 Servers
MySQL系列之九 mysql查询缓存及索引
2021/07/02 MySQL
Logback 使用TurboFilter实现日志级别等内容的动态修改操作
2021/08/30 Java/Android
Java实现贪吃蛇游戏的示例代码
2022/09/23 Java/Android