如何在Angular中使用生命周期钩子正确注释抽象基础组件

Question

我有一个带有生命周期挂钩的抽象基础组件：

export abstract class BaseComponent implements OnChanges, OnInit {

  ngOnChanges(changes: SimpleChanges): void {
    …
  }

  ngOnInit() {
    …
  }
}

还有一个子组件：

@Component({
  …
})
export class ChildComponent extends BaseComponent {

这将导致Can't resolve all parameters for BaseComponent: (?, ?, ?).

该参数确实具有三个参数。所有三个值都在包含子组件的模块的providers部分中列出。无法将基础组件添加到模块，因为它与declarations所需的类型不兼容。

如果我将@Injectable()添加到BaseComponent，tslint会抱怨In the class "BaseComponent" which have the "@Injectable" decorator, the "ngOnChanges()" hook method is not allowed. Please, drop it. (contextual-life-cycle)。一切都很好。

将@Component()添加到BaseComponent会导致Webstorm抱怨Component 'BaseComponent' is not included in a module and will not be available inside a template. Consider adding it to a NgModule declaration。同样，代码可以正常运行。

由于我喜欢使代码中没有任何警告：实现此模式的正确方法是什么？

Answer 1

根本没有注释基础组件（@Injectable和@Component都对我没有帮助）。