美文网首页
服务service

服务service

作者: 晨曦Bai | 来源:发表于2019-12-09 10:59 被阅读0次

    1. 创建服务

    ng g service example.ts

    得到如下文件结构:

    》 src/app/folder/example.ts
    import  { Injectable } from '@angular/core';
    import { Heroes } from './mock-heroes';
    @Injectable({
    provideIn: 'root',  // we  declare  that this service shoulde be created by the root application injector.
    })
    export  class ExampleService {
    getExample() {
    return  Heroes;
    }
    }
    

    2. 配置注入器

    1. @Injectable 将这个服务标记为可供注入的服务

    1. 想将其注入到什么位置时,应该先配置angular 的依赖注入器(dependency injector)

    1. 用 provider 配置依赖注入器

      在应用的不同层级配置注入器

      1. 在服务本身的 @Injectable() 装饰器中。
    image.png

    这个配置项告诉 Angular,要由此应用的根注入器负责通过调用 HeroService 的构造函数来创建它的实例。 并让该实例在整个应用程序中可用
    除了指定给 root 注入器之外,你还可以把 providedIn 设置为某个特定的 NgModule。 NgModule 没有用到该服务,它就会被摇树优化掉

    image.png
    2. 在 NgModule 的 @NgModule装饰器中。
    image.png
    你还可以在非根 NgModule 元数据的 providers 选项中配置一个模块级的提供商,以便把该服务的范围限定在该模块一级。 这和在 @[Injectable](https://angular.cn/api/core/Injectable)() 元数据中指定一个非根模块是基本等效的,但以 providers 形式提供的服务无法被摇树优化。
    一般来说,你不必在 providedIn 中指定 AppModule,因为应用中的 root 注入器就是 AppModule 注入器。 不过,如果你在 AppModule@NgModule() 元数据中配置了全应用级的提供商,它就会覆盖通过 @Injectable() 配置的那一个。
    3. 在组件的 @Component() 装饰器中。

    每个组件都有它自己的注入器。 通过使用 @Component 元数据 providers 在组件级配置某个提供商,你可以把这个提供商的范围限定到该组件及其子组件。你可以把这个提供商的范围限定到该组件及其子组件。

    image.png
    服务文件里@Injectable() 装饰器具有一个名叫 providedIn 的元数据选项
    @NgModule()@Component() 装饰器都有用一个 providers 元数据选项

    3. 注入服务

    image.png

    在某个注入器的范围内,服务是单例的。也就是说,在指定的注入器中最多只有某个服务的最多一个实例

    补充:

    1. 依赖注入器的工作: a. 创建服务实例,并把他们注入到向HeroListComponent 这样的类中。
    2. 注入器是可继承的,这意味着如果指定的注入器无法解析某个依赖,它就会请求父注入器来解析它。 组件可以从它自己的注入器来获取服务、从其祖先组件的注入器中获取、从其父 NgModule 的注入器中获取,或从 root 注入器中获取。

    相关文章

      网友评论

          本文标题:服务service

          本文链接:https://www.haomeiwen.com/subject/ztktwctx.html