Angular 4依赖注入学习教程之InjectToken的使用（八）

学习目录

本文主要给大家介绍的是关于Angular 4依赖注入之InjectToken使用的相关内容，分享出来供大家参考学习，下面来一起看看详细的介绍：

本系列教程的开发环境及开发语言：

基础知识

OpaqueToken 简介

OpaqueToken 用于创建可在 Provider 中使用的 Token。

OpaqueToken 类的定义

export class OpaqueToken { constructor(protected _desc: string) {} toString(): string { return `Token ${this._desc}`; }}

OpaqueToken 类的使用

import { ReflectiveInjector } from '@angular/core';var t = new OpaqueToken("value");var injector = ReflectiveInjector.resolveAndCreate([ {provide: t, useValue: "bindingValue"}]);injector.get(t); // "bindingValue"

InjectionToken 简介

InjectionToken 用于创建可在 Provider 中使用的 Token。

InjectionToken 类的定义

export class InjectionToken<T> extends OpaqueToken { private _differentiate_from_OpaqueToken_structurally: any; constructor(desc: string) { super(desc); } toString(): string { return `InjectionToken ${this._desc}`; }}

InjectionToken 类的使用

import { ReflectiveInjector } from '@angular/core';var t = new InjectionToken<string>("value");var injector = ReflectiveInjector.resolveAndCreate([ {provide: t, useValue: "bindingValue"}]);injector.get(t); // "bindingValue"

InjectionToken

在介绍 InjectionToken 相关内容之前，我们先回顾一下 "ValueProvider的使用" 这篇中我们介绍的内容：

使用 ValueProvider

@NgModule({ ..., providers: [ { provide: 'apiUrl', useValue: 'http://localhost:4200/heros' } ], bootstrap: [AppComponent]})export class AppModule { }

更新 HeroService 服务

@Injectable()export class HeroService { constructor(private loggerService: LoggerService, private http: Http, @Inject('apiUrl') private apiUrl) { } getHeros(): Observable<Array<{ id: number; name: string }>> { this.loggerService.log('Fetching heros...'); return this.http.get(this.apiUrl) .map(res => res.json()) }}

为了能够更方便地管理与维护 apiUrl 地址，我们利用了 ValueProvider 和 Inject 装饰器。一切看起来非常顺利，但某一天假设我们引入了一个第三方库 - third-lib.ts，该文件的内容如下所示：