出现错误：占位符名称与提供的翻译不匹配

问题描述

我们使用@ angular / localize（版本9.1.12），并且本地化文本中的占位符有问题。

E。 G。我们有：

$localize`:@@form.hint:Some text ${name} in service.`;

或

$localize`:@@form.hint:Some text ${name}:name: in service.`;

由于未提取打字稿文件中的本地化文本字符串，因此将其放入组件模板中。

E。 g。：

<p i18n="@@form.hint">Some text {{ name }} in service.</p>

在执行xi18n之后，我们得到包含以下内容的messages.xlf（和messages.de.xlf）文件：

<trans-unit id="form.hint" datatype="html">
  <source>Some text <x id="INTERPOLATION" equiv-text="{{ name }}"/> in service.</source>
  <target state="new">Some text <x id="INTERPOLATION" equiv-text="{{ name }}"/> in service.</target>
  <context-group purpose="location">
    <context context-type="sourcefile">src/app/translation/translation.component.html</context>
    <context context-type="linenumber">207</context>
  </context-group>
</trans-unit>

使用ng serve启动应用程序时，出现以下错误：

ERROR in There is a placeholder name mismatch with the translation provided for the message "form.hint" ("Some text {$PH} in service.").
The translation contains a placeholder with name INTERPOLATION,which does not exist in the message.

该应用程序无法运行。重新启动后，不会发生该错误，并且该应用程序可以运行。重新启动之前没有任何更改。

我们可以使用本地重启，但是在messages.xlf文件的每次更改之后，该错误再次发生，并且我们需要在构建服务器上安装两个ci-build才能在测试计算机上正常工作。

任何想法都可能是占位符不匹配的原因吗？

解决方法

对于当前的角度版本（10.1.3），您需要选择通过ivy提取翻译标记：

ng xi18n --ivy

结果将包含$localize中的文本。