Angular 12如何重写嵌套导入模块中提供的service-AA服务？

完全可以实现该需求，Angular依赖注入系统的就近查找规则天然支持这种上层模块替换下层模块服务实现的场景。

规则前提 #

你的模块依赖链为 AppModule → 导入 Module-A → 导入 Module-AA，且Module-AA以providers: [ServiceAA]的方式注册服务，属于模块级注入器注册。只要Module-AA内部的组件没有单独在自身的providers数组中再次注册ServiceAA，就可以通过上层注入器的配置替换原有服务实现。

具体实现步骤 #

• 第一步：创建自定义服务，继承原ServiceAA保证接口兼容，避免Module-AA内部调用时报错

import { Injectable } from '@angular/core';
import { ServiceAA } from 'module-aa/path/to/service-aa';

@Injectable()
export class CustomServiceAA extends ServiceAA {
  // 按需重写需要自定义的方法
  override targetMethod() {
    // 你的自定义逻辑
  }
}

• 第二步：在AppModule的providers数组中添加替换配置，将ServiceAA的token指向自定义服务

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { ModuleA } from './path/to/module-a';
import { ServiceAA } from 'module-aa/path/to/service-aa';
import { CustomServiceAA } from './path/to/custom-service-aa';
import { AppComponent } from './app.component';

@NgModule({
  imports: [BrowserModule, ModuleA],
  declarations: [AppComponent],
  providers: [
    { provide: ServiceAA, useClass: CustomServiceAA }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

效果验证 #

配置完成后，Module-AA内部所有通过构造函数注入ServiceAA的位置，都会自动拿到CustomServiceAA的实例，不需要修改Module-A、Module-AA的任何原有代码。

特殊说明：如果Module-AA内部的组件单独在组件级providers中注册了ServiceAA，组件级注入器优先级高于模块级注入器，上述配置无法生效，需要针对对应组件单独做替换处理。

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