即使我必须在我的 Angular 应用程序中调用 super() ，我如何将东西注入 parent class 构造函数？

Question

我正在使用一个 Angular 应用程序，我正在尝试解决问题。我这里有这段代码：

export abstract class ListPageComponent {
  ...
  constructor(protected ngZone: NgZone) {}
  ...
}

export class UserListPageComponent extends ListPageComponent {
  ...
  constructor(protected ngZone: NgZone) {
    super(ngZone);
  }
  ...
}

问题是这会创建两个对 ngZone 的引用，一个在 child 中，一个在 parent 中。我想要做的是将 ngZone 视为 child 可以访问的 parent class 的成员（即一个引用，而不是两个）。

我不得不调用 super(ngZone) 因为 Typescript 不允许我遗漏它。所以我要么调用 super(ngZone) 要么调用 super()，在这两种情况下我都没有将 ngZone 注入 parent 以便它可以在 parent 和 [=27] 之间共享=].

如果 ngZone 能以某种方式自动注入到 parent，那将解决我的问题，但我不确定该怎么做。任何帮助深表感谢。谢谢

Answer 1

我在这里要做的一个解决方法是创建一个可注入服务，负责创建共享的 NgZone class:

import { Injectable, NgZone } from '@angular/core';

@Injectable({
  providedIn: 'root',
})
export class SharedNgZoneService {
  constructor(public ngZone: NgZone) { }
}

然后在您的两个组件中使用此服务。

Answer 2

你具体问的，正如你所说，是不可能的。 Angular 只会实例化具体的 classes.

但是为什么需要组件级别的继承呢？我假设您具有要在组件之间共享的通用功能。我会改变策略。为共享功能使用瞬态*服务，而不是基础 class（即组合而不是继承）。当然，您仍然需要将该服务注入所有曾经从基类继承的组件 class，但这还不错，因为您会将共享功能保留在一个地方。

瞬态服务 - 通过使用工厂提供服务，以便每个组件实例获得其自己的服务实例。这最接近于有基数 class.

providers: [
  {
    provide: ListPageService,
    useFactory: (zone: NgZone) => new ListPageService(zone),
    deps: [NgZone]
  }
]

即使我必须在我的 Angular 应用程序中调用 super() ，我如何将东西注入 parent class 构造函数？

How do I inject things into a parent class constructor even though I have to call super() in my Angular application?

constructor

dependency-injection

parent-child

angular