angular依赖注入

angular的依赖注入
三个重要的概念介绍:
一、注入器:提供一系列的接口用于创建依赖对象的实例。
二、Provider:用来配置注入器,注入器通过它来创建被依赖对象的实例。
三、依赖:指定了被依赖对象的类型,注入器会根据此类型创建对应的对象。

在组件中注入服务

在组件中使用依赖注入需要完成以下三个步骤:
(1)通过import导入被依赖对象的服务
(2)在组件中配置注入器。在组件启动时,angular会读取@Component装饰器里的providers元数据,它是一个数组,配置了该组件需要使用到的所有依赖,Angular的依赖注入框架会根据这个列表来创建对应对象的实例。
(3)在组件构造函数中声明需要注入的依赖。
例如:

import {ContactService} from './shared/contact.service';
import{LoggerService} from './shared/logger.service';
@Component({
      selector: 'contact-app',
      providers: [ContactService],
      templateUrl: './app.component.html',
      styleUrls: ['./app.component.css'],
})
export class ContactAppComponent{
       constructor(logger:LoggerService,contactService: ContactService){}
}

每个组件都可以有自己的注入器,通过依赖注入到该组件中的每个服务都维持单例。如果某个组件不希望复用从根组件注入器获取的服务,则可以在自己的注入器中以新的配置重新注入,这是angular依赖注入的另一个特性,即层级注入。

在服务中注入服务

和在组件中注入类似
只有当一个服务依赖其他服务的时候,才需要用@Injectable()来显示的装饰,Angular官方推荐一个服务不论是否依赖其他的服务,都应该使用@Injectable()来装饰服务。

在模块中注入服务

Angular在启动程序时会启动一个根模块,并加载它所依赖的其他模块,此时会生成一个全局的根注入器,由该注入器创建的依赖注入对象在整个应用程序级别可见,并共享一个实例。同时,根模块会指定一个根组件并启动,由该根组件添加的依赖注入对象在组件树级别可见,在根组件及自组件中共享一个实例。

import {LoggerService} from './shared/logger.service'
@NgModule({
      import:[BrowserModule,ContactModule],
      declarations:[AppComponent],
      providers: [LoggerService],
      bootstrap:[Appcomponent]
});
export class AppModule{}
层级注入

注入可以发生在整个组件树的任意一个层级,并在各层级组件的注入器中维持单例,依赖注入可以传递到子孙组件中,子组件可以共享父组件中注入的实例,无需再创建。如果注入了多个实例,这些后代组件也可以共享这些实例。

Provider

用来描述注入器如何初始化标识所对应的依赖服务。
Provider注册方式:
类Provider

@NgModule({
      import:[BrowserModule,ContactModule],
      declarations:[AppComponent],
      providers: [LoggerService],
      bootstrap:[Appcomponent]
});

值Provider
依赖对象不一定是类,可以是常量、字符串、对象等其他数据类型,以方便用在全局变量、系统相关参数配置等场景中。
例如

@NgModule({
      import:[BrowserModule,ContactModule],
      declarations:[AppComponent],
      providers: [
           {provide:'urlSetting',useValue:globalSetting},
           {provide:'NAME',useValue:'揭秘Angular'}
      ],
      bootstrap:[Appcomponent]
});

别名Provider
可以在一个Provider中配置多个标识,其对应的对象指向同一个实例,从而实现多个依赖,一个对象实例的作用。
例如:

providers:[
      {provide:NewLoggerService,useClass:NewLoggerService},
      {provide:OldLoggerService,useClass:NewLoggerService}
]

工厂Provider
有时候依赖对象是不明确且动态变化的,可能需要根据运行环境、执行权限来生成。Provider需要一种动态生成依赖对象的能力,工厂Provider可以解决这个问题。

let contactServiceFactory = {_logger:LoggerService,_userService:UserService}=>{
      return new contactService(_logger,_userService.user.isAuthorized);
}
export let contactServiceProvider = {
      provide: ContactService,useFactory:contactServiceFactory,deps:[
       LoggerService,UserService]};

你可能感兴趣的:(angular依赖注入)