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

export class OpaqueToken {
 constructor(protected _desc: string) {}

 toString(): string { return `Token ${this._desc}`; }
}

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

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

export class InjectionToken<T> extends OpaqueToken {
 private _differentiate_from_OpaqueToken_structurally: any;
 constructor(desc: string) { super(desc); }

 toString(): string { return `InjectionToken ${this._desc}`; }
}

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

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

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

@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())
 }
}

export const THIRD_PARTY_PROVIDERS = [
 {
 provide: 'apiUrl',
 useValue: 'Other Url'
 }
];

import { THIRD_PARTY_PROVIDERS } from './third-party';

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

GET http://localhost:4200/Other%20value 404 (Not Found)

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

export const API_URL = new InjectionToken<string>('apiUrl');

import { API_URL } from './app.tokens';

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

import { API_URL } from './app.tokens';

@Injectable()
export class HeroService {
 constructor(private loggerService: LoggerService,
 private http: Http,
 @Inject(API_URL) private apiUrl) { }
}

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

const API_URL = new InjectionToken<string>('apiUrl');

export const THIRD_PARTY_PROVIDERS = [
 {
 provide: API_URL,
 useValue: 'Other value'
 }
];