什么是依赖注入?本篇文章带大家了解一下angular中的依赖注入,希望对大家有所帮助!
依赖注入概念:
维基百科对依赖注入的解释:在软件工程中,依赖注入是实现控制反转的一种软件设计模式,一个依赖是一个被其他对象(client)调用的对象(服务),注入则是将被依赖的对象(service)实例传递给依赖对象(client)的行为。
将 被依赖的对象传给依赖者,而不需要依赖者自己去创建或查找所需对象是di的基本原则。
依赖注入允许程序设计遵从依赖倒置原则(简单的说就是要求对抽象进行编程,不要对实现进行编程,这样就降低了客户与实现模块间的耦合) 调用者(client)只需知道服务的接口,具体服务的查找和创建由注入者(injector)负责处理并提供给client,这样就分离了服务和调用者的依赖,符合低耦合的程序设计原则。也是依赖注入的主要目的。【相关教程推荐:《angular教程》】
控制反转
控制反转和依赖注入是相辅相成的。例子:classa依赖classb但是classa不主动创建classb的实例,通过参数的形式传递进来。
class a { construct(private b: b) {}}class b {}const a: a = new a(new b());
angular依赖注入是实例化组件的时候,将服务的实例传递进来,形成了控制反转。
依赖注入
angular依赖注入使用的都是一个实例,也是angular通过服务通信的一种方式。如果不适用依赖注入,多个实例,组件间通信也就无法使用服务了。app.module.ts:
import { browsermodule } from '@angular/platform-browser';import { ngmodule, injectiontoken } from '@angular/core';import { appcomponent } from './components/app/app.component';import { singleserviceservice } from './service/single-service.service';import { myserviceservice } from './service/my-service.service';import { useserviceservice } from './service/use-service.service';import { valueserviceservice } from './service/value-service.service';import { reactiveformsmodule, formsmodule } from '@angular/forms';import { httpclientmodule } from '@angular/common/http';export interface appconfig { title: string}export const config = new injectiontoken<appconfig>('描述令牌的用途');const use_config = { title: "非类的注入令牌"}@ngmodule({ declarations: [ appcomponent ], imports: [ browsermodule, httpclientmodule, formsmodule, reactiveformsmodule ], providers: [ singleserviceservice, // 完整形式 // {provide: singleserviceservice, useclass: singleserviceservice} // provide 属性存有令牌,它作为一个 key,在定位依赖值和配置注入器时使用。 // 属性二通知如何创建依赖,实际依赖的值可以是useclass、 useexisting、usevalue 或 usefactory // useexisting起别名,依赖注入也可以注入组件 {provide: myserviceservice, useclass: useserviceservice}, // usevalue可以是字符串,对象等 {provide: valueserviceservice, usevalue: "依赖注入字符"}, // 使用 injectiontoken 对象来为非类的依赖选择一个提供者令牌 { provide: config, usevalue: use_config } ], bootstrap: [appcomponent], entrycomponents: []})export class appmodule { }
singleserviceservice:
import { injectable } from '@angular/core';@injectable()export class singleserviceservice {constructor() { }}
myserviceservice:
import { injectable } from '@angular/core';@injectable()export class myserviceservice { constructor() { } getname(): string { return "my-service"; } }
useserviceservice:
import { injectable } from '@angular/core';@injectable()export class useserviceservice { constructor() { } getname(): string { return "use-service"; }}
valueserviceservice:
import { injectable } from '@angular/core';@injectable()export class valueserviceservice {constructor() { }}
更多编程相关知识,请访问:编程视频!!
以上就是深入浅析angular中的依赖注入的详细内容。