Angular i18n $localize - 带表达式的模板文字

Question

我很难翻译这个语法 - Angular 13.0.02 .

我的两个资源是：

https://angular.io/api/localize/init/$localize
https://lokalise.com/blog/angular-i18n/

根据 Angular 文档：

Naming placeholders

 If the template literal string contains expressions, then the expressions will be automatically associated with placeholder names for you.

For example:

  $localize `Hi ${name}! There are ${items.length} items.`;

  will generate a message-source of Hi {$PH}! There are {$PH_1} items.`

并提供含义、描述和 ID：

$localize`:meaning|description@@id:source message text`;

$localize`:meaning|:source message text`;
$localize`:description:source message text`;
$localize`:@@id:source message text`;

lokalise.com 中的这个例子有效：

const company = "Google";
const created_by = $localize`Created by ${company}`;

在我的 XLIF 翻译文件中：

   <trans-unit id="3990133897753911565" datatype="html">
     <source>Created by <x id="PH"/></source>
     <target>Creado por... <x id="PH"/></target>
   </trans-unit>

这不符合要求：

然而，当我尝试用另一个 i18 术语重现相同的语法时，它不起作用。它只提取英文短语，不提取西班牙语短语。

 const company = "Google";
 const createdByCompany = $localize`Created by this person ${company}`;

<trans-unit id="spanishTest123" datatype="html">
    <source>Created by this person <x id="PH"/></source>
    <target>Creado por esta persona <x id="PH"/></target>
</trans-unit>

仅供参考：对于确实有效的示例，如果我删除 id="3990133897753911565"，则它不会提取该翻译。很明显，这个 id 实现了它 - 但在我的第二个示例中我无法让它工作。

*** 更新 ***

使用 Angular extract 工具以所需的 xml 格式生成 XLF 文件（它解析所有 i18n 标签 html 神庙，以及组件代码中的 $localize 调用）。运行在您应用程序的根目录中，如下所示 ng extract-i18n --output-path src/locale - 然后检查语言环境文件夹中的 messages.xlf 文件。

Answer 1

所以根据文档，“pre-pending it with a colon”语法确实有效 - https://angular.io/api/localize/init/$localize

const msg = $localize`:Password Reset Modal|Min num of chars@@passwordNumChars:Must be at least ${setting.SettingValue}:minLen: characters long.`;

请注意我是如何更新 xlf 中的 trans-unit“id”属性的——即我的自定义 ID 是“passwordNumChars”。

<trans-unit id="passwordNumChars" datatype="html">
    <source>Must be at least <x id="minLen" equiv-text="setting.SettingValue"/> characters long.</source>
    <target>Debe contener al menos <x id="minLen" equiv-text="setting.SettingValue"/> caracteres.</target>
    <note priority="1" from="meaning">password edit modal</note>
</trans-unit>

最后一点： 如果您在 ts 代码中设置了 $localize 函数 - 但您不知道 xlf 格式 - 您可以使用 ng extract-i18n --output-path src/locale 从 cmd 行生成适当的 xlf 文件。

然后 copy/paste 将您需要的部分添加到您的语言环境文件中；也可能进入您用作事实来源的任何翻译软件（即 poedit.com 存储所有 i18n 术语）。

Angular i18n $localize - 带表达式的模板文字

Angular i18n $localize - template literal with expressions

internationalization

angular-i18n