Angular 2：如何在基类组件中实现构造函数注入？

这个场景我在Angular开发中经常遇到——父组件依赖某个服务，但子类根本不需要直接使用它，却不得不在构造函数里声明并传递给super()，确实挺冗余的。下面给你两种干净的实现方式：

方案一：通过Injector让父类自行获取服务 #

这种方法最贴合你的需求：父类通过Angular的Injector主动获取所需的MyService，子类只需要把Injector传给父类，完全不需要接触MyService：

import { Component, Injector } from '@angular/core';
import { MyService } from './path-to-my-service';

export class BaseComponent {
  protected myService: MyService;

  constructor(injector: Injector) {
    // 从注入器中直接获取MyService实例
    this.myService = injector.get(MyService);
  }

  // 父类里可以正常使用this.myService实现通用逻辑
}

export class ChildComponent extends BaseComponent {
  // 子类只需要传递Injector，同时可以声明自己的专属依赖
  constructor(injector: Injector, private childSpecificService: ChildService) {
    super(injector);
    // 子类逻辑中也能直接访问this.myService（因为父类已经初始化了它）
  }
}

方案二：简化子类构造函数的参数声明 #

如果觉得用Injector有点繁琐，也可以让子类构造函数仅声明父类需要的依赖，但不用把它变成子类的属性（父类已经持有了）：

import { Component } from '@angular/core';
import { MyService } from './path-to-my-service';

export class BaseComponent {
  constructor(protected myService: MyService) {}
}

export class ChildComponent extends BaseComponent {
  // 这里的myService不需要加public/protected，只是作为参数传递给super
  constructor(myService: MyService, private childService: ChildService) {
    super(myService);
    // 子类不需要直接使用myService，所以不用把它挂载到子类实例上
  }
}

为什么原来的方式会出问题？ #

你之前尝试给super()传null，会导致父类的myService变成undefined，因为Angular的依赖注入系统没有机会注入真正的MyService实例——只有当构造函数参数被Angular解析时，才会自动注入对应的服务实例。

内容的提问来源于stack exchange，提问作者williamsandonz