angular - ngx-translate: prijevodi se ne prikazuju pri ponovnom učitavanju

U mojoj web aplikaciji koristim ngx-translate modul za lokalizaciju. Dobro funkcionira za HTML stringove koje prevodim pomoću pipeova. Imam problema sa stringovima prevedenim u mojim TS komponentama. Stringovi su prevedeni, ali ako osvježim stranicu, oni su prazni; ako odem na drugu stranicu unutar moje aplikacije i vratim se, opet su normalni. Definirao sam metodu:

public getTranslation(key: string){
    let str="";
    this.translate.get(key).subscribe(value => {str = value});
    return str;
}

Dakle, kada definiram varijable, koristim:

variable: string = this.getTranslation("key-in-my-json-file")

moja konfiguracija u app.module, loader:

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

i u uvozima:

TranslateModule.forRoot({
  loader: {
    provide: TranslateLoader,
    useFactory: (createTranslateLoader),
    deps: [HttpClient]
  }
})

moje verzije u package.json:

"@ngx-translate/core": "^8.0.0",
"@ngx-translate/http-loader": "^1.0.2",
"typescript": "2.5.2"

i verzija Angulara 4.3.6

Odgovor #1

Pokušajte koristiti localStorage. Na primjer, ja ga koristim u funkciji prilikom promjene jezika:

public changeLanguage(lang) {
  this.languageActive = lang;
  this.translateService.use(lang);
  localStorage.setItem("language", this.languageActive);
}

Odgovor #2

Okružite liniju s minimalnim timeoutom, tada će raditi.

setTimeout(()=> {
          variable: string = this.getTranslation("key-in-my-json-file");  
}, 500);

Povezani članci