Node.js ngx translate和angular universal:未找到客户端翻译

我用angular universal starter应用程序使用ngx translate已经有半天了，但没有成功https://github.com/angular/universal-starter。有人知道为什么跟踪不起作用吗

当我启动

npm start

我的服务器并重新加载我的页面时，我短暂地看到翻译被找到，然后被替换为

键

，这通常表明ngx translate不起作用。另外，当我在

服务器app.module.ts

中更改翻译路径时，我在服务器控制台中看到一个错误，因此我认为我的服务器部分正常，问题来自客户端

app.module.ts：

 export function exportTranslateStaticLoader(http: HttpClient) {
    return new TranslateHttpLoader(http, './assets/i18n/', '.json');
 }

 imports: [
    TranslateModule.forRoot({
    loader: {
      provide: TranslateLoader,
      useFactory: exportTranslateStaticLoader,
      deps: [Http]
    }
  }
  )
]

 imports: [TranslateModule.forChild()]

  export function translateFactory() {
    return new TranslateUniversalLoader('./dist/assets/i18n', '.json');
  }

  imports: [
      TranslateModule.forRoot({
         loader: {
          provide: TranslateLoader,
           useFactory: translateFactory
      }
    })
 ]

browser-app.module.ts：

 export function exportTranslateStaticLoader(http: HttpClient) {
    return new TranslateHttpLoader(http, './assets/i18n/', '.json');
 }

 imports: [
    TranslateModule.forRoot({
    loader: {
      provide: TranslateLoader,
      useFactory: exportTranslateStaticLoader,
      deps: [Http]
    }
  }
  )
]

 imports: [TranslateModule.forChild()]

  export function translateFactory() {
    return new TranslateUniversalLoader('./dist/assets/i18n', '.json');
  }

  imports: [
      TranslateModule.forRoot({
         loader: {
          provide: TranslateLoader,
           useFactory: translateFactory
      }
    })
 ]

server-app.module.ts：

 export function exportTranslateStaticLoader(http: HttpClient) {
    return new TranslateHttpLoader(http, './assets/i18n/', '.json');
 }

 imports: [
    TranslateModule.forRoot({
    loader: {
      provide: TranslateLoader,
      useFactory: exportTranslateStaticLoader,
      deps: [Http]
    }
  }
  )
]

 imports: [TranslateModule.forChild()]

  export function translateFactory() {
    return new TranslateUniversalLoader('./dist/assets/i18n', '.json');
  }

  imports: [
      TranslateModule.forRoot({
         loader: {
          provide: TranslateLoader,
           useFactory: translateFactory
      }
    })
 ]

TranslateUniversalLoader：

 import {Observable} from "rxjs/Observable";
 import {TranslateLoader} from '@ngx-translate/core';
 const fs = require('fs');

 export class TranslateUniversalLoader implements TranslateLoader {
   constructor(private prefix: string = 'i18n', private suffix: string = '.json') {}

   public getTranslation(lang: string): Observable<any> {
     return Observable.create(observer => {
 observer.next(JSON.parse(fs.readFileSync(`${this.prefix}/${lang}${this.suffix}`, 'utf8')));
       observer.complete();
     });
   }
 }

app.component.ts：

 ngOnInit() {
     this.translateService.setDefaultLang('en');
     this.translateService.use('en');
 }

此外，当我查询

http://localhost:8000/assets/i18n/en.json

我分别从我的en.json中得到了一个有效答案：

{
   "TEST": "Super super"
 }

---

感谢任何帮助，这让我发疯。

明白了，在app.module.ts中，我应该注入HttpClient而不是Http（关于AoT的自述仍然显示Http）：

---

明白了，在app.module.ts中，我应该注入HttpClient而不是Http（关于AoT的自述文件仍然显示Http）：

---

按照中的指导，尝试更简单的设置。你也可以检查这个Thx，但我不会尝试一个更简单的设置，我想在angular universal的情况下使用ngx translate，我的项目中除了一个universal starter应用程序和ngx translate的克隆之外没有其他任何东西。ngx translate团队在他们的文档中建议，这个更简单的设置是针对ngx translate的。它自动从

assets>i18n

中提取json文件，因此您无需在

webpack.common.js

中更改任何内容。最后，这是你的选择：）在这里，ngx translate的创建者@ocombe的例子展示了TranslateUniversalLoader的使用。接下来，我的服务器端，如我所说，看起来可以尝试一个更简单的设置，如中所述。你也可以检查这个Thx，但我不会尝试一个更简单的设置，我想在angular universal的情况下使用ngx translate，我的项目中除了一个universal starter应用程序和ngx translate的克隆之外没有其他任何东西。ngx translate团队在他们的文档中建议，这个更简单的设置是针对ngx translate的。它自动从

assets>i18n

中提取json文件，因此您无需在

webpack.common.js

中更改任何内容。最后，这是你的选择：）在这里，ngx translate的创建者@ocombe的例子展示了TranslateUniversalLoader的使用。下面是我的服务器端，正如我所说的，看起来很好，因为我得到了一个错误：没有提供程序HttpClient@netshark1000您很可能需要在app.module中导入HttpClientModule。HttpClientModule是在Angular 4.3中引入的，谢谢-它帮助消除了错误。但是找不到我的翻译（控制台中没有任何错误）..@netshark1000您应该创建一个新的单独问题/帖子，并记录您的问题（代码外观如何、模块、app.component、package.json等）有了这个，我得到了一个错误：没有提供程序HttpClient@netshark1000您很可能需要在app.module中导入HttpClientModule。HttpClientModule是在Angular 4.3中引入的，谢谢-它帮助消除了错误。但是找不到我的翻译（控制台中没有任何错误）..@netshark1000您应该创建一个新的单独问题/帖子，并记录您的问题（代码外观如何、模块、app.component、package.json等）