Angular 依赖注入

**依赖注入是实现控制反转的一种实现方式,
好处在于:降低耦合、使用组件常用性提高、便于测试**

在Angular中实现依赖注入需要三步:
1. 创建一个service,这个service就是要依赖注入的对象
2. 写提供器
3. 在构造函数中注入(Angular 只允许在构造函数中注入)

实例一:实现一个最简单依赖注入

先创建一个service :

ng g service shared/product

service 一般我们放在shared目录下面

实现product.service:

import { Injectable } from '@angular/core';

@Injectable()
export class ProductService {
  constructor() {}
  getProducts(): Product[] {
    '''''''''
  }
}

@Injectable()是一个修饰器,其作用是允许在该service中注入其他的service

写提供器(写在 app.module.ts中):

  providers: [ProductService],

这个是providers: [{provide:ProductService;useClass:ProductService }] 的缩写,也是最简单的一个提供器。后面会有一个使用工厂方法实现的提供器。

在构造函数中注入

constructor(private productService: ProductService) {}
``
现在就可以调用构造函数中的方法了。

实例二:使用工厂方法写提供器
--------------
先上一段代码,然后来解释:

providers: [
{ provide: ProductService,
useFactory: (logger: LoggerService, isDevEnv) => {
………………
},
deps: [LoggerService, ‘IS_DEV_ENV’],
},
LoggerService,
{ provide: ‘IS_DEV_ENV’, useValue: false }
],
“`
基本形式为:{ provide:ProductService, useFactory:(传入的变量)=>{具体如何选择service的实现} }
deps: [ ]; 这个数组储存工厂模式传入的变量类型(变量类型必须是提供器中声明了类型)
{ provide: ‘IS_DEV_ENV’, useValue: false } 定义一个变量的依赖注入;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值