Açısal 4 Hatası: HttpClient

Question

için bir sağlayıcı yok

CLI ile yeni bir açısal proje başlatıyorum ve HttpClient hatası için bir sağlayıcı olarak çalışıyorum.

Bu senaryoda olağan bir suçlu gibi görünen modül ithalatıma HttpClientModule ekledim. Bundan daha çok çevrimiçi bir şey bulamadığım için sorunun ne olabileceğinden emin değilim.

benim app.module.ts

@NgModule({ 
    declarations: [ 
    AppComponent 
    ], 
    imports: [ 
    BrowserModule, 
    HttpClientModule 
    ], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

ve benim hizmet

@Injectable() 
export class FlexSearchService { 


    constructor(private http: HttpClient) {} 

    getSavedSearchResult(index: string, queryName: string, query: string): Observable<any> { 
     const url = `${environment.flexUrl}/${index}/search`; 
     const item = new SearchQuery({queryName: queryName, variables: {q: query}}); 
     return this.http.post(url, item); 
    } 
} 

ve ng sürümü aşağıdaki çıktı üretmesi

@angular/cli: 1.4.2 
node: 6.9.4 
os: darwin x64 
@angular/animations: 4.4.4 
@angular/common: 4.4.4 
@angular/compiler: 4.4.4 
@angular/core: 4.4.4 
@angular/forms: 4.4.4 
@angular/http: 4.4.4 
@angular/platform-browser: 4.4.4 
@angular/platform-browser-dynamic: 4.4.4 
@angular/router: 4.4.4 
@angular/cli: 1.4.2 
@angular/compiler-cli: 4.4.4 
@angular/language-service: 4.4.4 
typescript: 2.3.4 

benim tsconfig verir

{ 
    "compileOnSave": false, 
    "compilerOptions": { 
    "outDir": "./dist/out-tsc", 
    "sourceMap": true, 
    "declaration": false, 
    "moduleResolution": "node", 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "target": "es5", 
    "typeRoots": [ 
     "node_modules/@types" 
    ], 
    "lib": [ 
     "es2017", 
     "dom" 
    ] 
    } 
} 

Testim

import { TestBed, inject } from '@angular/core/testing'; 
import { HttpClientModule } from '@angular/common/http'; 
import { FlexSearchService } from './flex-search.service'; 

describe('FlexSearchService',() => { 
    beforeEach(() => { 
    TestBed.configureTestingModule({ 
     providers: [FlexSearchService, HttpClientModule] 
    }); 
    }); 
    it('should be created', inject([FlexSearchService], (service: FlexSearchService) => { 
    expect(service).toBeTruthy(); 
    })); 

Herhangi bir yardım büyük beğeni topluyor! Testinizin

TestBed.configureTestingModule({ 
     providers: [FlexSearchService, HttpClientModule] 
    }); 

yılında

Answer 1

Bu daha kolay bir yoludur

TestBed.configureTestingModule({ 
     imports: [HttpClientModule], 
     providers: [FlexSearchService] 
    }); 

Answer 2

.... global bunu sağlamak şöyle app.module.ts aşağıdaki içe olmalıdır:

import { HttpModule } from '@angular/http' 
import { HttpClient, HttpClientModule } from '@angular/common/http'; 

ve ithalatta ilan:

imports: [ 
    HttpModule, 
    HttpClientModule, ... 
]