当仅替换值已更改时，如何强制更新已翻译的文本?

Question

在 Angular 4 中，我有一条消息"n 个设备已选择"，其中 n 被替换。消息已本地化，因此在 HTML 中看起来像

{{'selected_message' | translate:substitutions }}

其中"selected_message"在语言文件中有一个条目：

'selected_message': '{{ndevices}} devices selected.'

替换的值经常变化。但是，当 substitutions.ndevices 更改时，翻译系统不会重新运行翻译，因此消息始终显示为显示其初始值。如何强制重新运行翻译？

我尝试过的事情：

• 创建一个在组件中包含"selected_message"的变量;
• 将该变量重置为相同的内容("selected_message"(
• 将该变量设置为空字符串，然后立即返回到"selected_message">

我该怎么做？

Answer 1

我们不应该使用可变对象作为管道的输入，因为角度检查对象的引用以检测是否有任何输入更改，因此如果对象的属性被修改，角度将无法识别为新输入。因此，为了避免这种情况，我们可以以任何形式使用不可变的数据结构，例如不可变JS，或者在这种情况下如下所示，

与其在对象中设置属性，例如 substitutions.ndevices = "something"，我们应该使用 as 替换 = { ndevices： "something" }

Answer 2

如果我没记错的话，你会想要一个不懒惰的烟斗。

这个调整应该可以解决问题：

@Pipe({
name: 'flyingHeroesImpure',
pure: false
})

您可以在管道上找到更多信息，尤其是 https://angular.io/guide/pipes 上的纯和不纯

或者，使用可观察量，它为您提供数据流以及模板中的异步管道将确保您的 html 保持最新。