angular - ngx-translate：重新加载时不显示翻译

Question

在我的 webapp 中，我使用 ngx-translate 模块进行本地化。它适用于我使用管道翻译的 html 字符串。我在 ts 组件中翻译的字符串有问题。字符串被翻译，但如果我重新加载页面它们是空字符串，如果我转到我的应用程序内的其他页面并返回它们又是正常的。我定义了方法：

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

因此，当我定义变量时，我使用：

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

我在 app.module 中的配置，加载器：

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

和进口：

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

我在 package.json 中的版本：

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

和角度版本 4.3.6

Answer 1

尝试使用本地存储。例如，我在更改语言时在函数中使用它：

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

Answer 2

以最小的超时包围线路，然后它将起作用。

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