ngx-translate輸出無需翻譯即可返回

Question

我使用了本教程

https://ionicframework.com/docs/developer-resources/ng2-translate/

一切運行，我可以采用json格式，但不能打印輸出

en.json

{
    "HELLO": "hola",
    "hi":"sa"
  }

.ts構造函數;

 constructor(public navCtrl: NavController, public navParams: NavParams, public translate: TranslateService) {
    translate.setDefaultLang('en');
  }

.html塊;

<div style="width: 100%;">           
        <p class="baslik">ACCOUNT</p>
      <button ion-item>
          <ion-label>{{ 'hi' | translate }}</ion-label>
      </button>
      <button ion-item>
          <ion-label>{{ 'hi' | translate }}</ion-label>
      </button>
  </div>

但是輸出

你好

你好

添加按鈕單擊事件時，此代碼塊；

this.translate.use('en').subscribe(
      value => {
        // value is our translated string
        console.log(value);
      }

en.json返回日志；

Answer 1

我對您使用的翻譯框架不熟悉，但是從他們的文檔看來，您想使用自定義翻譯定義，但是您永遠不會調用：

translate.setTranslation('en', myTranslation);

myTranslation是您的對象。

您要設置為默認值的代碼中的'en'是一個字符串（用引號引起來），它看起來是翻譯服務用來確定后備語言是什么的某種標識符：

方法：

setDefaultLang（lang：string）：設置默認語言作為后備

你要：

setTranslation（lang：string，translations：Object，shouldMerge：boolean = false）：手動設置給定語言的翻譯對象，如果要附加翻譯而不是替換它們，則將shouldMerge設置為true

Answer 2

我遵循了您提供的教程，可以重現您的問題。

我還查看了github上ngx-translate存儲庫的官方文檔，這與您的教程有所不同。

在本教程中，他們使用Angular Http模塊的Http類加載文件：

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

在官方文檔中，他們使用的是Angular公共模塊的HttpClient類。 在您的應用模塊中更改以下內容：

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

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

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

官方文檔中有評論

注意：如果您仍使用Angular <4.3，請使用@ angular / http中的Http和http-loader@0.1.0。