You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Angular测试:如何正确配置依赖InjectorToken的组件测试环境?

解决Angular测试中Injector获取自定义InjectionToken的NullInjectorError问题

你遇到的问题根源在于:组件构造函数中注入的Injector是TestBed自动创建的根注入器,而你手动创建的Injector是完全独立的另一个实例,组件根本不会用到它。下面给你两种可行的解决方案,根据你的测试场景选择:

方案一:直接在TestBed中提供目标InjectionToken(推荐)

这是最简洁的常规解决方案,既然组件需要从Injector中获取TOKEN,那直接把TOKEN的提供者添加到TestBed的配置里即可,TestBed的根注入器会自动包含这个提供者:

// 注意要导入你定义的TOKEN,不要重新创建新的InjectionToken实例!
import { TOKEN } from './test.component';

TestBed.configureTestingModule({
  declarations: [ TestComponent ],
  providers: [
    { provide: TOKEN, useValue: 'your-test-value' } // 直接提供你的自定义Token
  ]
});

这样配置后,组件构造函数里的injector.get(TOKEN)就能从TestBed的注入器中成功获取到值,不会再抛出NullInjectorError。

方案二:手动指定组件使用自定义Injector(特殊场景)

如果你确实需要测试组件使用自定义Injector实例的场景(比如组件依赖一个特定的注入器配置),那不能直接在TestBed的根providers里替换Injector,而是要通过overrideComponent方法给组件本身指定Injector提供者:

import { TOKEN } from './test.component';

TestBed.configureTestingModule({
  declarations: [ TestComponent ]
}).overrideComponent(TestComponent, {
  set: {
    providers: [
      { 
        provide: Injector, 
        useValue: Injector.create({
          providers: [
            { provide: TOKEN, useValue: 'your-test-value' }
          ]
        }) 
      }
    ]
  }
});

这个方法会覆盖组件自身的providers配置,让组件构造函数注入的是你手动创建的Injector实例,里面包含了TOKEN的提供者。

注意:不要重新创建新的InjectionToken实例!一定要导入组件里定义的那个TOKEN,否则Angular会把它当成两个不同的Token,依然找不到提供者。

内容的提问来源于stack exchange,提问作者Christoph

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.14 08:26:20