Angular 从零开始 5-依赖注入

一. 依赖注入内容介绍
// https://angular.cn/guide/architecture#依赖注入
“依赖注入”是提供类的新实例的一种方式,还负责处理好类所需的全部依赖。
大多数依赖都是服务。 Angular 使用依赖注入来提供新组件以及组件所需的服务。

injector->注册provider->提供服务

二 依赖注入的好处

依赖注入的目的是为了降低组件间的耦合, 减少代码对于组件的侵入性, 提高模块代码复用度。

三 在哪里注册provider?

1. 提供商添加到根模块上
		*通常会把提供商添加到根模块上,以便在任何地方都使用服务的同一个实例。(单例)
2. 提供商添加到组件层-注意层次关系
		*(1)注册在组件级表示该组件的每一个新实例都会有一个服务的新实例。
		*(2)在父组件中添加供应商,所有子组件会共享同一个实例,反过来不行。
		*(3)当组件申请一个依赖时,Angular从该组件本身的注入器开始,沿着依赖注入器的树往上找,
			直到找到第一个符合要求的提供商。如果Angular不能在这个过程中找到合适的依赖,它就会抛出一个错误。

四 怎么注册provider,以及享受服务?

1. 如果providers:[HttpService];

   依赖注入如下  
    constructor(private http:HttpService){

	} 

2. (1)如果providers:[{provide: HttpService,  useClass: HttpService}]
	依赖注入如下  
	constructor(private http:HttpService){

	}  其中(1)是这种方式的简写方式,provide字段是token。

   (2)如果provider:[{provide: 'httpService',  useClass: HttpService}]
	依赖注入如下  
	constructor(@Inject("httpService") private http){

	} 注意token 避免命名冲突

3.  如果依赖值不是一个类呢?有时候想要注入的东西是一个字符串,函数或者对象。
	应用程序经常为很多很小的因素定义配置对象(例如应用程序的标题或网络API终点的地址)。

	如果provider:[{provide: 'api',  useValue: "http://www.***.com"}]
	依赖注入如下  
	constructor(@Inject("api") private api){

	}

4.  @Optional() 表示可有可无, 如果没有使用 Optional, 在没有provider 而尝试注入 service 的情况下, angular 是会报错的.
	@Host() 可以限制 injector 向上查找的范围, 终止与宿主关系

在这里插入图片描述

五 特别的功能

应用程序组件经常需要共享信息。我们喜欢更加松耦合的技术,比如数据绑定和服务共享。 
但有时候组件确实需要拥有另一个组件的引用,用来访问该组件的属性值或者调用它的方法。


在子组件中,注入父组件
import {AppComponent } from "../app.component";
constructor(private parent:AppComponent) { 

}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值