angular - tree-shakable 服务如何避免循环依赖，而 pre-Angular 6 DI 没有？

Question

首先，我创建一个要传入的函数useFactory：

// circular.factory.ts

export let circularFactory = (instance: MyService) => {
  console.log('calling useFactory with:', instance);
  return instance || new MyService()
}

现在我要配置 DI，使服务引用工厂，工厂引用服务。

第一个场景：

在这里，我使用了 pre-angular 6 DI 方式providers在NgModule我的AppModule.

// app.module.ts

@NgModule({
  imports: [BrowserModule],
  declarations: [AppComponent],
  bootstrap: [AppComponent],
  providers: [{
    deps: [
      [MyService]
    ],
    provide: MyService,
    useFactory: circularFactory
  }]
})
export class AppModule {}

运行将导致以下错误：

错误：提供程序解析错误：无法实例化循环依赖！MyService ("[ERROR ->]"): 在 NgModule AppModule 中的 ./AppModule@-1:-1

嗯，这是可以预料的。事实上，我创建了一个循环依赖。

第二种情况：

这次我将使用@Injectable() providedIn属性来配置 DI 以引用根。

// my.service.ts

@Injectable({
  deps: [
    [MyService]
  ],
  providedIn: 'root',
  useFactory: circularFactory
})
export class MyService {
  constructor() {
    console.log('instantiating MyService') 
  }
}

...

// app.component.ts

@Component({
  selector: 'app-component',
  template: `
    <h1>Oh, hi, there.</h1>
  `
})
export class AppComponent {
  constructor(public myService: MyService) {
    console.log('injecting dependency into AppComponent:', this.myService);
  }
}

如您所见，我添加了一些控制台日志用于调试目的。结果如下：

calling useFactory with: undefined
instantiating MyService
injecting dependency into AppComponent:

与第一种情况相反，它以某种方式设法将令牌解析为useFactoryinto undefined。但是怎么来的？它不应该像第一个示例那样因循环依赖错误而失败吗？它不应该以同样的方式工作吗？我无法得到它。

这是您可以运行的闪电战。

标签： angulardependency-injection