Ngx-translate setTraslation 在动态组件中缺少翻译答案

【问题标题】：Ngx-translate setTraslation missing translation in dynamic componentNgx-translate setTraslation 在动态组件中缺少翻译
【发布时间】：2018-04-25 06:49:50
【问题描述】：

我想加载定义自己的翻译的动态组件，但仍使用相同的 TranslateService 实例，以便全局语言更改事件到达动态组件。

我遇到了一个我认为是错误的问题，请参阅此 stackblitz 以进行复制：https://stackblitz.com/edit/github-1ujje5

以及github上的相关问题：https://github.com/ngx-translate/core/issues/834

任何建议如何解决这个问题？

【问题讨论】：

标签： angular ngx-translate

【解决方案1】：

发生这种情况是因为来自 http 请求的翻译覆盖了动态组件中设置的翻译。 https://github.com/alexzuza 在链接的 github 问题中提供的答案。

this.translate.getTranslation('en').pipe(take(1)).subscribe(() => {
  this.translate.setTranslation('en', {
    'DYNAMIC': 'I am dynamic component'
  }, true);
});

【讨论】：

【解决方案2】：

似乎第一次加载资产中的 i18n 文件将 shouldMerge 设置为 false。在加载动态组件之前等待这些文件被加载。

为此，我只是在 en.json 和 fr.json 中添加了一个愚蠢的翻译：

"LOADING_TEST": "LOADED"

然后使用这个 observable 来检测翻译是否加载：

this.translate.get('LOADING_TEST')
.pipe(filter(_ => _ != 'LOADED'), first());

Here is the fork with this suggested solution.

【讨论】：

你是对的，我会发布一个我认为更干净的答案。那个已发布到 github 问题。