使用TypeScript和Angular 5在抽象类中注入依赖项

我有

BaseComponent

，它注入了一些依赖项。第一个依赖项

EntityService

是正确且必要的

但是

AnyOtherService

仅在抽象

BaseComponent

中使用。与其将它注入未使用的

ChildComponent

中，我只想将它注入

basecomont

中

为什么我必须通过

ChildComponent

将其推向

BaseComponent

？最好的解决方案是将其封装在

BaseComponent

中

base.component.ts

export abstract class BaseComponent {
  constructor(
    protected entityService: EntityService,
    // protected anyOtherService: AnyOtherService // @todo add this
  ) {
  }
}

@Component()
export class ChildComponent extends BaseComponent {

  constructor(
    private firstService: FirstService,
    private secondService: SecondService,
    protected anyOtherService: AnyOtherService // @todo remove this
  ) {
    super(
      firstService,
      anyOtherService // @todo remove this
    ); 
  }
}

子组件.ts

export abstract class BaseComponent {
  constructor(
    protected entityService: EntityService,
    // protected anyOtherService: AnyOtherService // @todo add this
  ) {
  }
}

@Component()
export class ChildComponent extends BaseComponent {

  constructor(
    private firstService: FirstService,
    private secondService: SecondService,
    protected anyOtherService: AnyOtherService // @todo remove this
  ) {
    super(
      firstService,
      anyOtherService // @todo remove this
    ); 
  }
}

---

因此，您可以将注入器传递给基本组件构造函数（更新）：

其思想是在子组件中注入Injector和一些提供者，并将其传递给父基组件，而不传递所有基类依赖项。 使用传递注入器，子类（组件）不需要注入父类（基类）和传递抛出超类（dep1、dep2…，baseDep1…）的所有依赖项

请你在回答中解释一下，为什么你会这样 说的是私密的孩子和受保护的家长

---

我认为注入器不应该是child/基类的属性。如果是，则在下面的注释中抛出错误。错误是，Base和Child类在其类中不能具有相同的属性。这就是为什么我们需要在构造函数中省略private/protected或任何访问修饰符到injector，也因为injector仅在构造函数中需要手动注入我们在某些特定情况下需要的内容。

您可以这样尝试，使用injector，从appmodule导出它并在基类中使用它

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

//exporting injector 
export let AppInjector: Injector;

export class AppModule {
  constructor(private injector: Injector) {
    AppInjector = this.injector;
  }
}

然后是base.component.ts

export abstract class BaseComponent {
  private anyOtherService : AnyOtherService ;
  constructor(
    protected entityService: EntityService,
    // protected anyOtherService: AnyOtherService // @todo add this
  ) {
    this.anyOtherService = AppInjector.get(AnyOtherService );
  }
}

---

抽象类中似乎缺少某些内容。当您想在构造函数内将某些内容推入其中时，尚未设置this.anyOtherService`。是的，您应该将entityService定义为BaseComponent属性这不是完全需要的行为

FirstService

应该作为

entityService

注入，而

anyOtherService

应该只是

anyOtherService

的一个实例。我还收到了一条错误消息：

类型有单独的私有属性“注入”声明。

在子组件中删除了private，并将其设置为protected on baseWhat do你是说“从appmodule导出”吗？我是否应该将此添加到我的

app.module.ts

？@MichaelCzechowski-类似于

export-let-AppInjector:Injector

its可以是您的基本模块，也可以是您的基本组件所在的位置，它不必位于appmodule级别，您可以在您的模块中创建与basecomponent相关的模块，并使用小心：在客户端，这是可行的，但使用像这样的“全局注入器”方法和服务器端渲染（SSR）由于Angular为每个页面加载设置了一个新的注入器，因此可能会导致严重问题，如看似随机的不匹配用户会话/cookie数据。为每个请求分配

AppInjector

，因为所有请求都在同一运行时运行，如果暂停一个异步操作请求，另一个请求进入并执行，当您继续执行第一个请求时，您将在

AppInjector

持有的注入器内拥有错误的请求状态。