エラー：HttpServiceのプロバイダがありません！カルマテストでは、

Question

私はサーバーを監視するための角度2のツールを持っていて、テストを開始しました。私がhttpServiceを模倣しようとすると、私はRest-APIを模擬する方法を知っていたので、オンラインで見て、いくつかのエラーを修正して、これに固執しました。
ここでエラー：

Chrome 53.0.2785 (Windows 10 0.0.0) HttpServiceFront should use an HTTP call Servers FAILED 
     Error: No provider for HttpServiceFront! 
      at NoProviderError.Error (native) 
      ... 
      at drainMicroTaskQueue (webpack:///~/zone.js/dist/zone.js:368:0 <- config/karma-test-shim.js:6854:36) 
Chrome 53.0.2785 (Windows 10 0.0.0): Executed 2 of 3 (1 FAILED) (skipped 1) (0.268 secs/0.057 secs) 

ここでは私のテストケースである：助けを

import { 
    ResponseOptions, 
    Response, 
    Http, 
    BaseRequestOptions, 
    RequestMethod 
} from '@angular/http'; 

import { 
    TestBed, fakeAsync, inject 
} from '@angular/core/testing'; 

import { HttpServiceFront } from '../app/services/httpServiceFront'; 

import { MockBackend, MockConnection } from '@angular/http/testing'; 

const mockHttpProvider = { 
    deps: [ MockBackend, BaseRequestOptions ], 
    useFactory: (backend: MockBackend, defaultOptions: BaseRequestOptions) => { 
     return new Http(backend, defaultOptions); 
    } 
}; 

describe('HttpServiceFront',() => { 
    beforeEach(() => { 
     {Http, mockHttpProvider} 
     TestBed.configureTestingModule(
      [MockBackend, 
      BaseRequestOptions] 
     ) 
    }); 

    it('should use an HTTP call Servers', 
     inject(
      [HttpServiceFront, MockBackend], 
      fakeAsync((service: HttpServiceFront, backend: MockBackend) => { 
       backend.connections.subscribe((connection: MockConnection) => { 

        expect(connection.request.method).toBe(RequestMethod.Get); 
        expect(connection.request.url).toBe(
         'http://localhost:8080/server'); 
       }); 

       service.getServers(); 
      }))); 
}); 

感謝:)

Answer 1

あなたの構文の継ぎ目間違っていると、docsを確認してください。このようなものはうまくいくはずです：

beforeEach(() => { 
    TestBed.configureTestingModule({ 
     providers: [ 
      { provide: Http, useValue: mockHttpProvider }, 
      MockBackend, 
      BaseRequestOptions] 
    }) 
});