ngx-translate/core "エラー：HttpClientのプロバイダがありません！"

Question

パッケージngx-translate/coreをダウンロードし、ドキュメントの指示に従っています。

翻訳が正常に動作しません。私が作った ステップ：

1]

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { TranslateModule } from '@ngx-translate/core'; 
import { HttpClientModule, HttpClient } from '@angular/common/http'; 
import { TranslateLoader } from '@ngx-translate/core'; 
import { TranslateHttpLoader } from '@ngx-translate/http-loader'; 

import { routing } from './app.routes'; 

import { AppComponent } from './app.component'; 

export function HttpLoaderFactory(http: HttpClient) { 
    return new TranslateHttpLoader(http); 
} 

    @NgModule({ 
    declarations: [ 
    AppComponent 
    ], 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    routing, 
    TranslateModule.forRoot({ 
     loader: { 
     provide: TranslateLoader, 
     useFactory: HttpLoaderFactory, 
     deps: [HttpClient] 
     } 
    }) 
    ], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

2 AppModuleのすべてを定義] AppComponent

import { Component } from '@angular/core'; 
import { TranslateService } from '@ngx-translate/core'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'], 
    providers: [] 
}) 
export class AppComponent { 
    param = { value: 'world' }; 

    constructor(private router: Router, translate: TranslateService) { 
    // this language will be used as a fallback when a translation isn't found in the current language 
    translate.setDefaultLang('en'); 

    // the lang to use, if the lang isn't available, it will use the current loader to get them 
    translate.use('en'); 
    } 
} 

に

3のすべてを定義] HTML

<div>{{ 'HELLO' | translate:param }}</div> 

4]最後にassets/i18n/en.jsonに作成されました

私は私が間違っているのは何

以下のスクリーンショットでは、これらのエラーを得続ける

{ 
    "HELLO": "Hi There" 
} 

？

Answer 1

このngx-translate/coreはNgModule

import { HttpClientModule } from "@angular/common/http"; 

    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpClientModule, // the change from http module 
    routing, 
    TranslateModule.forRoot({ 
     loader: { 
     provide: TranslateLoader, 
     useFactory: HttpLoaderFactory, 
     deps: [HttpClient] 
     } 
    }) 
    ] 

に輸入配列に、次の代わりに、古いHttpModule変更の最新HttpClientModuleを使用しています詳細はDifference between HTTP and HTTPClient in angular 4?を参照してください。