系统执行过程:
1.创建Module
2.注册Provider
3.配置Provider
4.RUN
一、providerCache 用来存储 [provider结构]
预先存储
1.$provide
providerCache.$provide = {
provider: supportObject(provider),
factory: supportObject(factory),
service: supportObject(service),
value: supportObject(value),
constant: supportObject(constant),
decorator: decorator
}
2.$injector: providerCache.$injector = providerInjector = createInternalInjector() = {
invoke: invoke,
instantiate: instantiate,
get: getService,
annotate: createInjector.$$annotate,
has: function (name) {
return providerCache.hasOwnProperty(name + providerSuffix) || cache.hasOwnProperty(name);
}
}
3. 通过$provide.provider向providerCache注册其他的provider
function provider(name, provider_) {
assertNotHasOwnProperty(name, 'service');
if (isFunction(provider_) || isArray(provider_)) {
provider_ = providerInjector.instantiate(provider_);
}
if (!provider_.$get) {
throw $injectorMinErr('pget', "Provider '{0}' must define $get factory method.", name);
}
return providerCache[name + providerSuffix] = provider_;
}
整个注册过程:
1. setupModuleLoader得到Module
2. 通过Module的provider()方法开始注册provider
3. 将provider预先放到invokeQueue中,包含:
[provider=>'$provide', method=>'provider(),service(),factory()',
arguments=>'recipeName, factoryFunction'
]
4. runInvokeQueue 来执行 invokeQueue
function runInvokeQueue(queue) {
var i, ii;
for (i = 0, ii = queue.length; i < ii; i++) {
var invokeArgs = queue[i],
provider = providerInjector.get(invokeArgs[0]);
provider[invokeArgs[1]].apply(provider, invokeArgs[2]);
}
}
5.通过providerInjector的getService('$provide')获取 $provide
6.$provide的provider()将provider放入providerCache
二、整个配置运行过程
1.setupModuleLoader得到Module
2.通过Module的config()方法开始配置
3.将配置模块预先放到configBlocks中,包含:
[provider=>'$injector', method=>'invoke()',
arguments=>'configFn'
]
4. runInvokeQueue 来执行 configBlocks
5.通过providerInjector的getService('$injector')获取 $injector
6.$injector的invoke进行 provider的DI,此时的provider为注册时的[provider结构]
因此被DI的provider应该使用名字+"Provider",否则会提示错误。
throw $injectorMinErr('unpr', "Unknown provider: {0}", path.join(' <- '));
注:
$injector.get 为得到[provider结构]
$injector.invoke 为对[provider结构]的DI
三、instanceCache 用来存储 [provider的实例]
1. $injector:instanceCache.$injector = instanceInjector = createInternalInjector();
instanceInjector.invoke 进行各种 [provider实例]的 DI
注:
$injector.get 为得到[provider实例]
$injector.invoke 为对[provider实例]的DI
四、Module的创建
通过 setupModuleLoader进行模块创建:
参数1: 模块名称
参数2: requires
参数3: 配置函数,类似于 module.config
五、providerInjector和instanceInjector
providerInjector [provider结构]注入器
instanceInjector [provider实例]注入器
分享到:
相关推荐
Services / Factories 这些核心服务集可通过依赖注入(DI)来供你的应用使用。 例如:$compile, $http, $location… Filters 这些ng模块中的核心过滤器用于在指令和表达式被渲染前转换模板数据。 例如:filter, ...
本文主要介绍AngularJs Dependency Injection,这里整理了详细资料及示例代码有兴趣的小伙伴可以参考下
实现这一功能通过使用以下方式: 使用Ajax – 让一台服务器来调用获取相应的HTML页面,并将其设置在HTML控件的innerHTML。 使用服务器端包含 – JSP,PHP等Web端服务器技术可以在包括动态页面中的HTML页面。 使用...
angularjs-webpack-starter 该存储库的目的是演示项目的现代前端设置,以使其更接近... 使用严格执行DI 包含块的生产版本 用法 要使用此启动程序,您只需使用以下命令即可将其克隆到您喜欢的位置 git clone https://
这里使用了容器B(是指用来实现 IOC/DI 功能的一个框架程序)。 A需要访问C B获取C然后返回给A IOC inversion of control 控制反转:站在容器角度。B控制A,由B反向的向A注入C。即容器控制应用程序,由容器反向的向...
requirejs-angularjs-uiroute-uploadfile 用requirejs搭建angularjs项目,以及angularjs常用功能使用demo #注意 项目的资源并没有用bower管理,直接提交了 先手动搭建一个server,让项目可以正常访问 index.html是...
angularjs简称ng,是google出品的mvvm框架,此在提高前端项目开发效率(实践中来看确实很能提高开发效率),以控制器,指令,服务来围绕整个项目,内部以独有的DI来解决三层之前的调用问题.更多的详情信息可以参考我之前写的...
Angular-PHP-Slim 我自己的Webapp支架,使用AngularJS作为前端,使用PHP Slim作为后端。 该脚手架使用: PHP 5.4以上Apache HTTP服务器MySQL Node.js(作为开发工具),Yeoman,Grunt,Bower 作曲家发展一些常用的...
将Angular 1.x DI注释添加到Babel正在处理的ES5 / ES6代码中,并支持显式注释( /* @ngInject */ )和典型的Angular代码模式的自动(隐式)注释。 与ES5,移植ES6和原始ES6来源完全兼容。 与独立的ng-annotate工具...
我们将使用AngularJS的依赖注入(dependency injection (DI))功能来为PhoneListCtrl控制器提供这个AngularJS服务。 请重置工作目录: git checkout -f step-5 刷新浏览器,你现在应该能看到一个20部手机的列表。 ...
AngularJS 模块语法从注释上的代码注释生成。 是的,疯狂的东西。 为什么 中讨论了为什么它可能是一个好主意。 其中包含所有受支持的注释 这个怎么运作 该模块将遍历语法树并查找具有一些特殊注释标签的注释,并将...
angularjs中与DI相关有angular.module()、angular.injector()、 $injector、$provide。对于一个DI容器来说,必须具备3个要素:服务的注册、依赖关系的声明、对象的获取。比如spring中,服务的注册是通过xml配置文件...
angularjs简称ng,是google出品的mvvm框架,此在提高前端项目开发效率(实践中来看确实很能提高开发效率),以控制器,指令,服务来围绕整个项目,内部以独有的DI来解决三层之前的调用问题.更多的详情信息可以参考我之前写的...
wiki 上的解释是:依赖注入(Dependency Injection,简称DI)是一种软件设计模式,在这种模式下,一个或更多的依赖(或服务)被注入(或者通过引用传递)到一个独立的对象(或客户端)中,然后成为了该客户端状态的...
添加带注释(/ * @ngInject * /)的AngularJS DI。 所有版本中均包含源地图。 具有Autoprefixer和SASS的样式表(不是必需的,它也支持常规CSS)。 具有实时重载和HMR的开发服务器。 具有Karma和Jasmine的测试...
在花了一些时间试图使我的AngularJS 1.x项目尽可能整洁之后,我决定利用TypeScript语言的出色可读性,并使用Spring(和其他Java框架)开发人员非常熟悉的功能来丰富它:基于类型的依赖注入。 如果您有一些Spring编程...
培训经理 Angularjs(JS 框架) + Guice(DI 框架) + Jersy(Rest 框架) + Hibernate(JPA)
如果我们想做这件事,我们首先要在module中注册一个service工厂方法,可以通过Module.factory api(http://docs.angularjs.org/api/angular.module)或者在module配置方法中直接通过$provide api...
ng-dice 具有依赖项注入(DI)和代码提取(CE)技巧的AngularJS(NG)单元测试假设您要对Angular代码进行单元测试,但是有两个条件直接从Node运行单元测试,而无需使用浏览器(太慢且不稳定) 测试未公开导出的代码...