Angular DI注入令牌与现有提供者：单个及批量服务注入问题

嘿，我来帮你把这个批量注入的配置搞定！你已经有了MY_SERVICES注入令牌，接下来只需要两步就能实现批量注入的需求：

第一步：更新模块的Providers配置 #

首先要修改模块里的providers数组，给每个服务添加上和MY_SERVICES令牌的关联，一定要加上multi: true——这是核心，没有它的话，后面的服务会覆盖前面的，最后你只能拿到最后一个服务实例。

你可以直接手动写每个服务的配置：

import { MY_SERVICES } from './path/to/your-token-file';
import { CommonInterface } from './path/to/common-interface';
import { Service_1, Service_2, Service_3 } from './path/to/services';

@NgModule({
  // ...其他模块配置（比如declarations、imports这些）
  providers: [
    // 保留原来单个注入的配置（如果你还需要单独注入每个服务的话）
    Service_1,
    Service_2,
    Service_3,
    // 批量注入的关键配置
    { provide: MY_SERVICES, useClass: Service_1, multi: true },
    { provide: MY_SERVICES, useClass: Service_2, multi: true },
    { provide: MY_SERVICES, useClass: Service_3, multi: true }
  ]
})
export class YourFeatureModule { }

如果想偷懒（或者服务数量多的时候更高效），可以利用你已经定义好的services数组，用map生成这些配置：

const services = [Service_1, Service_2, Service_3];

@NgModule({
  providers: [
    ...services,
    // 用map批量生成批量注入的提供者
    ...services.map(service => ({
      provide: MY_SERVICES,
      useClass: service,
      multi: true
    }))
  ]
})
export class YourFeatureModule { }

另外提个小建议：你原来的注入令牌泛型写的是CommonInterface，其实应该改成CommonInterface[]，这样类型更准确，注入的时候也不用额外指定类型：

// 修正注入令牌的泛型为数组类型
export const MY_SERVICES = new InjectionToken<CommonInterface[]>('my services');

第二步：在组件中批量注入服务 #

现在就可以在组件里通过MY_SERVICES令牌直接注入整个服务数组啦：

import { Component, Inject } from '@angular/core';
import { MY_SERVICES } from './path/to/your-token-file';
import { CommonInterface } from './path/to/common-interface';

@Component({
  selector: 'app-your-component',
  templateUrl: './your-component.component.html'
})
export class YourComponent {
  constructor(
    // 保留你已经实现的单个服务注入
    private service1: Service_1,
    private service2: Service_2,
    private service3: Service_3,
    // 批量注入的服务数组
    @Inject(MY_SERVICES) private allServices: CommonInterface[]
  ) {
    // 现在你可以随意遍历这个数组，调用CommonInterface定义的方法啦
    this.allServices.forEach(service => {
      service.commonMethod(); // 假设你的接口里有这个方法
    });
  }
}

这样就完美实现了既可以单独注入每个服务，又能批量拿到所有服务数组的需求啦！

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