1 angular应用中依赖注入的工作原理

  技巧01:在模块级别进行注册时所有在应用级别的组件都可以使用,因为主模块会导入其他模块,所以在模块中注入就相当于在主模块进行注入操作;懒加载的模块除外

  技巧02:在模块的根组件注入时只有在该模块的根组件及其子组件才可以使用

  技巧03:如果有两个模块都进行了相同的注册,那么只有一个会生效,因为这两个模块都会在根模块中进行导入操作,所以只有一个注册会生效,另外一个会被覆盖;懒加载的模块除外

  技巧04:注册的都是单例的

  技巧05:通过工厂方法进行注册时,可以根据条件创建不同的实例

  形象比喻:注入器(provider)相当于茄子、豆角、土豆,注入器(injector)相当于厨师,依赖注入对象(object)相当于地三鲜;provider提供了创建实例的原材料,injector会根据provider提供的原材料创建实例,在目标组件的构造器中注入依赖注入对象

  angular会到组件的控制类中的构造器中去查看需要进行依赖注入的对象类型,然后根据这个类型到提供器中去寻找和这个类型同名的token,然后根据token后面的注册方式来创建需要的实例,最后再把这个实例赋值给构造器中对应类型的形参

  

2 注入器

  就是组件控制类中的构造函数

3 提供器

  3.1 模块配置文件中的 providers 属性

    

  3.2 组件@Component中的 providers  属性

  3.3 注意:这两种方法的用法一致,只是作用域有区别;在模块中声明是整个模块所有组件可用,在组件中声明是该组件及其子组件可用

4 依赖注入服务

  4.1 创建服务

    ng g service 服务名称

  

    注意:利用angular-cli创建的服务时没有添加到提供器中的,如果要使用新创建的服务器就必须先将其在提供器中进行声明

  

  4.2 在组件中依赖注入服务

    利用组件控制类的构造器作为注入器来实现依赖注入

    

  4.3 启动服务后报错

    报错原因:我们创建的服务还没有在提供器进行声明,所以angular应用找不到相关的服务

    

    解决办法

      在模块的提供器或者组件的提供器中对需要用到的服务进行声明

import {BrowserModule} from '@angular/platform-browser';
import {NgModule} from '@angular/core'; import {AppComponent} from './app.component';
import {FormsModule} from '@angular/forms';
import {HttpModule} from '@angular/http';
import { Stock01Component } from './stock/stock01/stock01.component';
import {StockService} from './shared/stock.service'; @NgModule({
declarations: [ // 声明在该模块中有哪些东西(组件、指令、管道)
AppComponent, Stock01Component
],
imports: [ // 声明该模块需要正常运转时需要用到哪些模块(即:该模块依赖哪些其它模块)
BrowserModule,
FormsModule,
HttpModule
],
providers: [
StockService
], // 声明模块中的服务
bootstrap: [AppComponent] // 声明该模块的主组件
})
export class AppModule {
}

  4.4 再次启动服务后angular应用运行成功

5 一个服务实现另外一个服务

  B服务实现A服务时,B服务必须实现A服务中的多有方法

  

Angular08 依赖注入的更多相关文章

  1. webapi - 使用依赖注入

    本篇将要和大家分享的是webapi中如何使用依赖注入,依赖注入这个东西在接口中常用,实际工作中也用的比较频繁,因此这里分享两种在api中依赖注入的方式Ninject和Unity:由于快过年这段时间打算 ...

  2. ASP.NET Core 中文文档 第四章 MVC(3.8)视图中的依赖注入

    原文:Dependency injection into views 作者:Steve Smith 翻译:姚阿勇(Dr.Yao) 校对:孟帅洋(书缘) ASP.NET Core 支持在视图中使用 依赖 ...

  3. 在WPF中使用依赖注入的方式创建视图

    在WPF中使用依赖注入的方式创建视图 0x00 问题的产生 互联网时代桌面开发真是越来越少了,很多应用都转到了浏览器端和移动智能终端,相应的软件开发上的新技术应用到桌面开发的文章也很少.我之前主要做W ...

  4. MVVM模式解析和在WPF中的实现(六) 用依赖注入的方式配置ViewModel并注册消息

    MVVM模式解析和在WPF中的实现(六) 用依赖注入的方式配置ViewModel并注册消息 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二 ...

  5. .Net Core MVC 网站开发(Ninesky) 2.3、项目架构调整-控制反转和依赖注入的使用

    再次调整项目架构是因为和群友dezhou的一次聊天,我原来的想法是项目尽量做简单点别搞太复杂了,仅使用了DbContext的注入,其他的也没有写接口耦合度很高.和dezhou聊过之后我仔细考虑了一下, ...

  6. ASP.NET Core中如影随形的”依赖注入”[下]: 历数依赖注入的N种玩法

    在对ASP.NET Core管道中关于依赖注入的两个核心对象(ServiceCollection和ServiceProvider)有了足够的认识之后,我们将关注的目光转移到编程层面.在ASP.NET ...

  7. ASP.NET Core中如影随形的”依赖注入”[上]: 从两个不同的ServiceProvider说起

    我们一致在说 ASP.NET Core广泛地使用到了依赖注入,通过前面两个系列的介绍,相信读者朋友已经体会到了这一点.由于前面两章已经涵盖了依赖注入在管道构建过程中以及管道在处理请求过程的应用,但是内 ...

  8. 模拟AngularJS之依赖注入

    一.概述 AngularJS有一经典之处就是依赖注入,对于什么是依赖注入,熟悉spring的同学应该都非常了解了,但,对于前端而言,还是比较新颖的. 依赖注入,简而言之,就是解除硬编码,达到解偶的目的 ...

  9. angular2系列教程(八)In-memory web api、HTTP服务、依赖注入、Observable

    大家好,今天我们要讲是angular2的http功能模块,这个功能模块的代码不在angular2里面,需要我们另外引入: index.html <script src="lib/htt ...

随机推荐

  1. ThinkPHP中Widget的两种写法及调用

    Widget扩展一般用于页面组件的扩展,在页面根据需要输出不同的内容,下面介绍一下ThinkPHP中Widget的两种写法及调用 写法一: ArticlWidget.class.php文件: clas ...

  2. HackerRank - camelcase 【字符串】

    思路 找单词 第一个 单词 是小写 然后 后面的单词 第一位 都是大写 刚开始 初始化 ans = 1 然后 往后遍历 碰到 大写的 更新答案 AC代码 #include <cstdio> ...

  3. CKeditor插件开发流程(一)

    1.放在多文件中 第一步:config.js中 config.extraPlugins = '插件名称';//注册插件,extraPlugins只允许出现一次,你如果之前有新增别的插件,那么用逗号分隔 ...

  4. 从mysqldump整库备份文件中恢复单表

    最近,系统更新出现了问题,比较紧急,需要对三张表进行回档.由于我们都是采用mysqldump进行每天全备整库,数据量比较大,一个备份文件大概有70G,需要从这个70G文件中恢复三张表,真是蛋疼至极啊, ...

  5. UI控件概述

    常见UI控件 UIKit框架提供了非常多功能强大又易用的UI控件,以便于开发者打造出各式各样的App 以下列举一些在开发中常见的UI控件(稍后补上图片示例) 1.UILabel– 文本标签:作用是显示 ...

  6. ThinkPHP的Auth类认证

    Auth 类已经在ThinkPHP代码仓库中存在很久了,但是因为一直没有出过它的教程, 很少人知道它, 它其实比RBAC更方便 .  RBAC是按节点进行认证的,如果要控制比节点更细的权限就有点困难了 ...

  7. poj 1840 Eqs 【解五元方程+分治+枚举打表+二分查找所有key 】

    Eqs Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 13955   Accepted: 6851 Description ...

  8. Nexus4_识别电池真假

    1.参考网址:http://bbs.gfan.com/android-7509786-1-1.html ([6_25更新]给N4换一个“原装的芯”&[免拆]识别真假电池 - LG Nexus ...

  9. CDH- 测试mr

    cdh的mr样例算法的jar包在 [zc.lee@ip---- hadoop-0.20-mapreduce]$ pwd /opt/cloudera/parcels/CDH--.cdh5./lib/ha ...

  10. 激活idea2018

    首先下载安装完成后,打开hosts文件,新增一条路由: 0.0.0.0 account.jetbrains.com 打开软件输入序列码: EB101IWSWD-eyJsaWNlbnNlSWQiOiJF ...