代码之家 › 专栏 › 技术社区 › valik

ng测试期间的静态注入错误

angular

2

valik · 技术社区 · 8 年前

我在运行ng测试时遇到此错误我的应用程序模块似乎正常我在模块中有所有导入,在服务测试中我有提供商[服务]我不知道为什么所有测试都失败下面是失败测试之一请提供建议谢谢

   Error: StaticInjectorError(DynamicTestModule)[OrderService -> HttpClient]: 
              StaticInjectorError(Platform: core)[OrderService -> HttpClient]: 
                NullInjectorError: No provider for HttpClient!
                at _NullInjector.webpackJsonp../node_modules/@angular 
            Error: StaticInjectorError(DynamicTestModule)[OrderService -> HttpClient]: 
          StaticInjectorError(Platform: core)[OrderService -> HttpClient]: 
            NullInjectorError: No provider for HttpClient!

这是服务级别

import  { Injectable } from '@angular/core';
 import {HttpClient, HttpErrorResponse, HttpHeaders, HttpResponse} from "@angular/common/http"; 

@Injectable()
export class OrderService {

  baseUrl : string = 'http://localhost:8088/orders';

  filterUrl: string = 'http://localhost:8088/orders?start=?&end=?';

  private order: Order;
  private headers = new HttpHeaders({'Content-Type': 'application/json'});


  constructor(private http: HttpClient) { }

  getOrders(From: Date, To: Date): Observable<Order[]> {
    return this.http.get(this.baseUrl + '?start=' + From + '&end=' + To)
      .pipe(map(this.extractData),
        tap(data => console.log(JSON.stringify(data))),
        catchError(this.handleError)
      );
  }

  createOrder(order: Order): Observable<number> {
    return this.http.post(this.baseUrl, JSON.stringify(order), {headers: this.headers})
      .pipe(map(this.extractData),
        catchError(this.handleError));
  }

I应用程序模块。ts我有

imports: [
    NgbModule.forRoot(),
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    HttpClientModule,
    ReactiveFormsModule

  ],
      providers: [OrderService,TruckService],
export class AppModule {
   constructor(router: Router) {
     console.log('Routes: ', JSON.stringify(router.config, undefined, 2));
    }
 }

这就是测试

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

  afterEach(inject([HttpTestingController], (httpClient: HttpTestingController) => {
    httpClient.verify();
  }));


  it(`should create`, async(inject([TruckService, HttpTestingController],
    (service: TruckService, httpClient: HttpTestingController) => {
      expect(service).toBeTruthy();
    })));

1 回复 | 直到 8 年前

1

2

R. Richards 8 年前

为了测试使用HttpClient的服务,您必须包含来自Angular的测试模块和控制器。

这包括 HttpClientTestingModule 用于后端配置,以及 HttpTestingController 用于模拟和刷新请求。

以下是一些对你有用的东西:

import { TestBed, async, inject } from '@angular/core/testing';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { TruckService } from './truck.service';

describe('TruckService', () => {

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

afterEach(inject([HttpTestingController], (httpClient: HttpTestingController) => {
    httpClient.verify();
}));

it(`should create`, async(inject([TruckService, HttpTestingController],
    (service: TruckService, httpClient: HttpTestingController) => {
    expect(service).toBeTruthy();
})));
});

有关在Angular HttpClient中测试HTTP请求的详细信息,请访问 here 。以下是API的详细信息 HttpClientTestingModule 和 HttpTestingController 。