Angular 2带参数构造函数的依赖注入实现问题

嘿，这个问题我之前在项目里也碰到过！Angular的依赖注入（DI）系统默认只能自动解析那些它“认识”的依赖——也就是其他已经注册过的服务。当你给服务的构造函数加上自定义参数（比如这里的nm:string），Angular完全不知道该从哪里获取这个字符串的值，自然就会报错。下面给你几种实用的解决办法：

方法一：使用注入令牌（Injection Token）+ @Inject 装饰器 #

这是最常用的方式，适合传递静态或可配置的参数。

步骤1：定义注入令牌 #

首先创建一个注入令牌，用来标识你要传递的参数：

import { InjectionToken } from '@angular/core';

// 创建一个字符串类型的注入令牌，描述性字符串可选
export const SERVICE_NAME_TOKEN = new InjectionToken<string>('ServiceName');

步骤2：在提供者中配置参数值 #

在你的模块（比如AppModule）或者组件的providers数组里，注册这个令牌对应的参数值：

import { NgModule } from '@angular/core';
import { MyFirstServiceClass } from './MyFirstService.service';
import { SERVICE_NAME_TOKEN } from './tokens';

@NgModule({
  // ...其他模块配置
  providers: [
    MyFirstServiceClass,
    { provide: SERVICE_NAME_TOKEN, useValue: 'MyCustomServiceName' }
  ]
})
export class AppModule { }

步骤3：修改服务构造函数接收参数 #

在服务的构造函数里，用@Inject装饰器指定要注入的令牌：

import { Injectable, Inject } from '@angular/core';
import { SERVICE_NAME_TOKEN } from './tokens';

@Injectable()
export class MyFirstServiceClass{
  constructor(@Inject(SERVICE_NAME_TOKEN) private nm:string){
    // 现在可以正常使用this.nm了
  }

  SayHello(){
    alert(`Hello, ${this.nm}! I'm Service...`);
    return `Hello, ${this.nm}! I'm Service...`;
  }
}

方法二：使用工厂提供者（useFactory） #

如果你的参数需要动态生成，或者依赖其他服务，用工厂函数来创建服务实例会更灵活。

基础用法（静态参数） #

直接在工厂函数里生成参数值：

providers: [
  {
    provide: MyFirstServiceClass,
    useFactory: () => {
      // 这里可以写逻辑生成参数，比如从环境变量读取
      const serviceName = 'DynamicGeneratedName';
      return new MyFirstServiceClass(serviceName);
    }
  }
]

依赖其他服务的场景 #

如果参数需要从另一个服务获取，加上deps数组声明依赖：

// 假设你有一个用来获取配置的服务
export class ConfigService {
  getServiceName(): string {
    return 'NameFromConfigService';
  }
}

// 在providers里配置
providers: [
  ConfigService,
  {
    provide: MyFirstServiceClass,
    useFactory: (configService: ConfigService) => {
      const name = configService.getServiceName();
      return new MyFirstServiceClass(name);
    },
    deps: [ConfigService] // 声明工厂依赖的服务
  }
]

方法三：传递配置对象（进阶） #

如果服务需要多个参数，推荐把参数封装成配置对象，用注入令牌传递，这样更易维护：

定义配置接口和令牌 #

export interface MyServiceConfig {
  name: string;
  version?: string; // 可选参数
}

export const MY_SERVICE_CONFIG = new InjectionToken<MyServiceConfig>('MyServiceConfig');

配置提供者 #

providers: [
  MyFirstServiceClass,
  { 
    provide: MY_SERVICE_CONFIG, 
    useValue: { 
      name: 'ConfiguredService',
      version: '1.0.0'
    } as MyServiceConfig 
  }
]

服务接收配置 #

@Injectable()
export class MyFirstServiceClass{
  constructor(@Inject(MY_SERVICE_CONFIG) private config: MyServiceConfig){}

  SayHello(){
    return `Hello, ${this.config.name}! Version: ${this.config.version}`;
  }
}

核心思路就是：告诉Angular的DI系统如何获取你构造函数里的自定义参数值，不管是用注入令牌直接传值，还是用工厂函数动态生成，只要让DI能拿到参数，就能正常创建服务实例啦。

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