如何在Angular中重用i18n翻译键?

时间:2017-08-16 21:02:17

标签: angular internationalization

我正在使用对Angular2(4.0.3)的i18n支持,如记录here。我已经生成了xlf个文件,一切都很愉快。

但是,假设我有一个链接到我主页的菜单按钮。我使用属性i18n="@@homeTitle"创建DOM节点。现在,在我的主页组件中,我想在我的<h1>标记中使用相同的翻译ID ,这样我就可以获得相同的翻译,而无需使用相同的条目维护多个条目xlf个文件中的内容。

我原本希望做类似下面的事情,让它自动填充我的<a>节点并进行适当的翻译。

// home.component.html
<h1 i18n="@@homeTitle">Home</h1>

// menu.component.html
<a routerLink="/" i18n="@@homeTitle"></a>

然而,这不起作用。 <a>节点显示空文本,而不是翻译目标。 (此外,默认情况下,自动生成的messages.xlf文件中没有转换目标。)

文档实际上call out this situation但不提供解决方案。用户on GitHub也会针对常见字符串(如 Monday cancel )调出此问题,但该问题线程未涵盖此特定问题的解决方案。

如何在多个节点中重复使用xlf个文件中定义的i18n翻译?

修改:以下是使用xlf生成的ng-xi18n --i18nFormat=xlf

<?xml version="1.0" encoding="UTF-8" ?>
<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
  <file source-language="en" datatype="plaintext" original="ng2.template">
    <body>
      <trans-unit id="homeTitle" datatype="html">
        <source>Home</source>
        <target/>
      </trans-unit>
    </body>
  </file>
</xliff>

如果切换了两个@@homeTitle节点的解析顺序,<source>将分别更改。

1 个答案:

答案 0 :(得分:3)

<强> TLDR ;只是不要担心自定义ID并正确编写字符串。 ng xi18n工具将负责在单个<trans-unit>下匹配相同的字符串。然后,您的翻译将应用于整个单元。

更长的解释:xi18n工具通过字符串相等性匹配应用中的字符串。每当它找到一个新字符串时,它会将它与已经找到的字符串进行比较。如果存在完全匹配,则它会在现有<trans-unit>中包含新字符串。如果没有,则创建一个新ID并生成新ID。

但是,可以使用自定义ID和转换提示更改此行为。如果找到新字符串并包含自定义ID,则将检查当前消息是否包含此特定ID,并将其分配给现有<trans-group>(如果找到)。请注意,此过程忽略字符串本身,因此任何非空值将与自定义ID合并到找到的<trans-group>中。空字符串被省略。

正如文档所提到的,只会检查具有自定义ID的第一个元素 source 字符串。当存在具有相同ID的第二个元素时,将不会解析它的字符串值。这意味着您可以更改解决方案,以使包含自定义ID的所有其他节点包含占位符字符串。然后本地化将按预期工作。

// home.component.html
<h1 i18n="@@homeTitle">Home</h1>
// menu.component.html
<a routerLink="/" i18n="@@homeTitle">ANY PLACEHOLDER STRING YOU WANT</a>

正如您可能看到的,这看起来并不特别花哨。此外,您必须记住自定义ID以便进一步重复使用。除非绝对必要,否则我建议不这样做。在我看来,只需编写字符串(在您的情况下为"Home"),在元素上打一个i18n属性并且不用担心重复使用会更容易,因为它会是自动完成。我主要使用自定义ID,以防您需要对一个字符串进行多种不同的(上下文)翻译。