Angular ngx翻译/核心“;错误:HttpClient没有提供程序&引用;

Angular ngx翻译/核心“;错误:HttpClient没有提供程序&引用;,angular,ngx-translate,Angular,Ngx Translate,我已经下载了ngx translate/core软件包,并按照文档说明进行了操作 我无法翻译。 我采取的步骤是: 1] 定义AppModule中的所有内容 import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HttpModule } fro

我已经下载了ngx translate/core软件包,并按照文档说明进行了操作

我无法翻译。 我采取的步骤是:

1] 定义AppModule中的所有内容

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] 在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>
我一直在下面的屏幕截图中看到这些错误


我做错了什么?

ngx translate/core
使用最新的
HttpClientModule
而不是旧的
HttpModule
更改
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]
      }
    })
  ]

有关更多详细信息,请参阅。

Yiu在您的应用程序导入中缺少
HttpClientModule
。这对我很有效
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]
      }
    })
  ]