Angular 7 使用全局注入器的组件继承

Question

我一直在使用 MSDN blog post 中描述的方法来简化扩展组件，而无需在 super() 调用中提供所有依赖项。但是，这在 Angular 7 和 Typescript 3 中已停止工作。

所以发生的事情是，在引导之后，我试图将注入器存储在服务中，然后我尝试检索它。

platformBrowserDynamic().bootstrapModule(AppModule).then(ref => {
  // Store module's injector in the AppInjector class
  console.log('Expected #1: storing app injector');
  AppInjector.setInjector(ref.injector);
})

然后在基础组件中获取存储的注入器

export class BaseComponent {
  constructor() {
    console.log('Expected #2: retrieving stored injector');
    const injector = AppInjector.getInjector();
  }
}

但是查看控制台，顺序是相反的——首先调用 BaseComponent 的构造函数，然后 boostrapModule() 的承诺被解析。

我不确定在 Angular 7 中引导程序的行为是否有所不同，正如控制台日志提示的那样。与 Typescript 2 在 Angular 6 中使用的解决方案完全相同，但在版本 7 中它已停止工作。这是基于 MSDN 文章的损坏应用程序的堆栈闪电战：https://stackblitz.com/edit/component-inheritance-angular-7

所以根本问题是——如何保证AppInjector.setInjector()发生在AppInjector.getInjector()之前？

Answer 1

我已经在 AppModule 中设置了注入器服务，这意味着我将注入 Injector 并将其设置在 AppModule 的构造函数中，并将注入器服务存储在全局对象中

export class AppModule { 
  constructor(injector:Injector){
  // Store module's injector in the AppInjector class
  console.log('Expected #1: storing app injector');
  AppInjector.setInjector(injector);
  }
}

demo

Angular 7 使用全局注入器的组件继承

Angular 7 Component Inheritance using a global injector

inheritance

typescript

angular

angular7