typescript Angular 7测试：空注入器错误：ActivatedRoute没有提供程序

zmeyuzjn 于 2022-11-26 发布在 TypeScript

关注(0)|答案(5)|浏览(136)

嗨有一些错误与测试我的应用程序与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();
    }
  )
)
});

我实在找不到任何解决的办法。
达尼埃莱

typescript

来源：https://stackoverflow.com/questions/53654341/angular-7-test-nullinjectorerror-no-provider-for-activatedroute

5条答案

按热度按时间

vu8f3i0k1#

必须导入RouterTestingModule

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

imports: [
    ...
    RouterTestingModule
    ...
]

赞(0）回复(0）举报 2022-11-26

nzk0hqpo2#

添加以下导入

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

赞(0）回复(0）举报 2022-11-26

mepcadol3#

我在测试的时候也遇到过这个错误，这些答案都没有真正帮助我。我解决这个问题的方法是同时导入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";

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

赞(0）回复(0）举报 2022-11-26

kadbb4594#

此问题可以通过以下方法解决：
1.在相应的spec.ts文件中导入RouterTestingModule
import { RouterTestingModule } from '@angular/router/testing';
1.在同一文件中添加RouterTestingModule作为导入之一

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

赞(0）回复(0）举报 2022-11-26

bvjveswy5#

使用服务和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();
    });

    });

赞(0）回复(0）举报 2022-11-26

我来回答

typescript Angular 7测试：空注入器错误：ActivatedRoute没有提供程序

5条答案

相关问题

热门标签

最新问答