Angular 7 测试：NullInjectorError：ActivatedRoute 没有提供者答案

【问题标题】：Angular 7 Test: NullInjectorError: No provider for ActivatedRouteAngular 7 测试：NullInjectorError：ActivatedRoute 没有提供者
【发布时间】：2019-05-08 07:45:47
【问题描述】：

您好，在测试我使用 Angular 7 制作的应用时出现了一些错误。我在 Angular 方面没有太多经验，所以我需要您的帮助+

Error: StaticInjectorError(DynamicTestModule)[BeerDetailsComponent -> ActivatedRoute]: 
  StaticInjectorError(Platform: core)[BeerDetailsComponent -> ActivatedRoute]: 
    NullInjectorError: No provider for ActivatedRoute!

测试代码是这样的：

import { async, ComponentFixture, TestBed, inject } from '@angular/core/testing';
import { BeerDetailsComponent } from './beer-details.component';
import {
  HttpClientTestingModule,
  HttpTestingController
} from '@angular/common/http/testing';

describe('BeerDetailsComponent', () => {
  let component: BeerDetailsComponent;
  let fixture: ComponentFixture<BeerDetailsComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [HttpClientTestingModule],
      declarations: [ BeerDetailsComponent ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(BeerDetailsComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create',
  inject(
    [HttpTestingController],
    () => {
      expect(component).toBeTruthy();
    }
  )
)
});

我真的找不到任何解决方案。

丹尼尔

【问题讨论】：

标签： angular testing jasmine karma-runner

【解决方案1】：

这个问题可以解决如下：

在你对应的spec.ts文件中导入RouterTestingModule

import { RouterTestingModule } from '@angular/router/testing';

在同一文件中添加 RouterTestingModule 作为导入之一

 beforeEach(() => {
    TestBed.configureTestingModule({
    imports: [RouterTestingModule],
    providers: [Service]
  });
 });

【讨论】：

【解决方案2】：

我在测试时也遇到过这个错误，但这些答案都没有真正帮助我。为我解决的问题是同时导入 RouterTestingModule 和 HttpClientTestingModule。

所以基本上它在你的whatever.component.spec.ts 文件中看起来像这样。

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ProductComponent],
      imports: [RouterTestingModule, HttpClientTestingModule],
    }).compileComponents();
  }));

您可以从

获取导入

import { RouterTestingModule } from "@angular/router/testing";
import { HttpClientTestingModule } from "@angular/common/http/testing";

我不知道这是否是最好的解决方案，但这对我有用。

【讨论】：

【解决方案3】：

使用服务和ActivatedRoute的简单测试示例！祝你好运！

    import { async, ComponentFixture, TestBed } from '@angular/core/testing';
    import { RouterTestingModule } from '@angular/router/testing';
    import { HttpClientModule } from '@angular/common/http';
    import { MyComponent } from './my.component';
    import { ActivatedRoute } from '@angular/router';
    import { MyService } from '../../core/services/my.service';


    describe('MyComponent class test', () => {
    let component: MyComponent;
    let fixture: ComponentFixture<MyComponent>;
    let teste: MyComponent;
    let route: ActivatedRoute;
    let myService: MyService;

    beforeEach(async(() => {
        teste = new MyComponent(route, myService);
        TestBed.configureTestingModule({
        declarations: [ MyComponent ],
        imports: [
            RouterTestingModule,
            HttpClientModule
        ],
        providers: [MyService]
        })
        .compileComponents();
    }));

    beforeEach(() => {
        fixture = TestBed.createComponent(MyComponent);
        component = fixture.componentInstance;
        fixture.detectChanges();
    });

    it('Checks if the class was created', () => {
        expect(component).toBeTruthy();
    });

    });

【讨论】：

您是否在任何地方使用teste？需要什么？
我在工作的任何地方都使用，这是一种确保应用程序在进行一些更改后继续工作而不会破坏我的代码的方法。

【解决方案4】：

你必须导入 RouterTestingModule

import { RouterTestingModule } from "@angular/router/testing";

imports: [
    ...
    RouterTestingModule
    ...
]

【讨论】：

当我这样做时，我开始收到错误NullInjectorError: No provider for ActivatedRoute!
您是否将此模块导入到规范文件中？
我相信解决方案是为路由添加一个提供者，使用包含测试访问的属性的匿名对象。
这应该是公认的答案

【解决方案5】：

添加以下导入

  imports: [ 
    RouterModule.forRoot([]),
    ...
  ],

【讨论】：

我应该在哪里导入RouterModule.forRoot([])，？
在模块import { RouterModule } from '@angular/router';
:) 如果有帮助，请确保检查为答案。
RouterModule 不应包含在测试文件中
这不是一个合适的解决方案，您需要定义所有 roter 模块提供程序参数、APP_BASE_HREF 令牌等。使用没有路由器提供程序声明的 RouterTestingModule 代替