You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

Angular单元测试报错:NullInjectorError: No provider for DatePipe

Angular单元测试报错:NullInjectorError: No provider for DatePipe

嗨,这个问题我之前也碰到过,其实是你对Angular内置管道的提供方式理解错啦!DatePipe属于Angular的CommonModule的一部分,不是直接把它加到providers数组里就能用的。

你现在的测试模块里只导入了TranslateModule和RouterModule,没导入CommonModule,导致TestBed找不到DatePipe的提供者,所以才抛出了这个NullInjectorError。

解决方法很简单,只需要在TestBed的imports数组里添加CommonModule,同时把providers里的DatePipe删掉就行,修改后的代码如下:

import { CommonModule } from '@angular/common';
import { DatePipe } from '@angular/common';
import { TestBed } from '@angular/core/testing';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { TaskDetailsService } from './task-details.service';

fdescribe('TaskDetailsService', () => {
  let service: TaskDetailsService;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [CommonModule, TranslateModule.forRoot(), RouterModule.forRoot([])],
      providers: [TaskDetailsService],
    });

    service = TestBed.inject(TaskDetailsService);
  });

  fit('should be created', () => {
    expect(service).toBeTruthy();
    expect(service.getPlaceholder(2)).toBe('Find in failed tasks');
  });
});

为什么要这么做呢?因为Angular的所有内置管道(比如DatePipe、UpperCasePipe这些)都是由CommonModule统一提供的,只要导入这个模块,TestBed就能自动识别并加载这些管道的提供者,不用手动去注册。

如果你的Angular版本是14及以上,也可以尝试使用provideDatePipe来单独提供,但导入CommonModule是最通用、最稳妥的做法,毕竟它还包含了其他常用的内置指令和管道,后续测试如果用到其他的也不用再额外导入啦。

备注:内容来源于stack exchange,提问作者Gopi

火山引擎 最新活动