Angular i18n - 在 HTML 属性显示中翻译 Typescript 值答案

【问题标题】：Angular i18n - Translate Typescript value in HTML Attribute DisplayAngular i18n - 在 HTML 属性显示中翻译 Typescript 值
【发布时间】：2018-11-03 06:26:58
【问题描述】：

是否有机会对将从 typescript 函数中检索到的 HTML 属性进行翻译？例如，请参见下文。

<myCustomElement buttonId="personDetails" [title]="CustomSectionDisplayName('PersonDetails')" link="Person details"  linkText="Name, age and gender"></myCustomElement>

对于上面的代码，我想翻译到达 [title] 属性的值。对于静态值，我们可以做到这一点。但在这里，它是动态的。那么，有人可以建议我在 i18n 中的任何选项吗？

[注意：我不期待答案，因为我们可以通过 ngx-translate 等其他库来实现。]

我很想知道这一点。请告诉我。

【问题讨论】：

我不知道我在stackoverflow.com/questions/48327401/… 中的解决方法是否可以使用，或者，真的，这是一个非常糟糕的坏主意。另一个想法是有一个 file-fr.json、file-es.json... 并从中读取值
您好，Eliseo，感谢您的更新。我已经检查了链接，您正在尝试实现 thro' 自定义翻译组件。你有任何plunker吗？翻译模板是否会将处理后的文本值告诉xlf文件以便翻译？
如果您对此有任何演示，将会很有帮助。感谢您的更新！

标签： angular angular-i18n

【解决方案1】：

我认为你可以尝试使用规范形式进行绑定，使用例如 bind-title 而不是 [title] 然后添加 i18n 属性如下： i18n-bind-title="test@@title" 它对我有用！

【讨论】：

【解决方案2】：

要标记要翻译的属性，请以 i18n-x 的形式添加属性，其中 x 是要翻译的属性的名称。以下示例展示了如何通过在 img 标签上添加 i18n-title 属性来标记标题属性以进行翻译：

这种技术适用于任何元素的任何属性。

您还可以使用 i18n-x="|@@" 语法指定含义、描述和 ID。

【讨论】：