angular2 模块 : Dependency Injection with OpaqueToken works from JS Module, 但不是内联

Question

我正在关注依赖注入(inject)的 Angular 文档，并尝试复制关于 dependency injection tokens 的部分.

在单独的 JS 模块中定义 OpaqueToken

// app-config.ts
import { OpaqueToken } from '@angular/core';

export let APP_CONFIG = new OpaqueToken('app.config');

// use class instead of interface
export interface AppConfig {
  apiEndpoint: string;
  title: string;
}

export const HERO_DI_CONFIG: AppConfig = {
  apiEndpoint: 'api.heroes.com',
  title: 'Dependency Injection'
};

导入 APP_CONFIG 并定义 APP_CONFIG2

// app-modules.ts
import { APP_CONFIG, HERO_DI_CONFIG } from './app-config.ts';
export let APP_CONFIG2 = new OpaqueToken('app.config2');

@NgModule({
  imports: [ BrowserModule ],
  declarations: [ App ],
  providers: [
    {provide: APP_CONFIG, useValue: HERO_DI_CONFIG},
    {provide: APP_CONFIG2, useValue: HERO_DI_CONFIG},
  ],
  bootstrap: [ App ]
})

和注入(inject)到组件构造函数中

// app.ts
import { APP_CONFIG, AppConfig } from './app-config.ts'
import { APP_CONFIG2 } from './app-module.ts'

export class App {
  constructor(
    @Inject(APP_CONFIG) public opaqueToken: AppConfig
    @Inject(APP_CONFIG2) public opaqueToken2: any
  ) {
    this.name = 'Angular2'
    this.local = LOCAL_STRING
  }
}

在外部模块中定义的

APP_CONFIG 被正确注入(inject)，但是在与 provide 相同的模块中定义的 APP_CONFIG2 抛出一个错误。这是为什么？

VM466 zone.js:323Error: (SystemJS) 错误:无法解析 App 的所有参数:(Token_app_config, ?,

这是一个 plunkr:http://plnkr.co/edit/5TkKAozC2vjXI9DfjMLg?p=preview

Answer 1

这不是 Angular 的问题，而是 es6 模块之间的循环依赖。

在您的示例中，app.ts 从 app.module.ts 导入 APP_CONFIG并且 app.module.ts 从 app.ts 导入 App。

这会产生无法解决的循环依赖。