Question

我正在为演示目的开发Angular应用程序，并且已经实现了图书商店应用程序，C＃等基本的Web Api。

现在我正在使用Angular i18n实用程序将我的应用程序制作成法语和土耳其语。我参考了Angular文档，并为标签，文本输入和占位符工作。但是我已经为“注册和登录”页面实现了反应式表单。它具有基于用户输入的各种自定义验证，通过绑定不同的错误消息来使用插值法生成错误消息。

如何根据消息翻译不同的消息。即。错误消息是“必须输入用户名”，因此应将其翻译为法语；如果错误消息是“必须输入电子邮件”，则应将其翻译为法语。

我已经搜索了插值并根据文档进行了尝试，但是找不到解决方法。

 <div>
     <p *ngIf="messageerrors" style="color:red" i18n>{{messageerrors}}</p>
</div>

 messageerrors : string = '';

 this.messageerrors = "username must be required";

 this.messageerrors = "Email must be required";

 <!--message.xlf file-->
<trans-unit id="144f3b27d028b0f3d2f79e9ad8996f73703778b3" datatype="html">
    <source>
    <x id="INTERPOLATION" equiv-text="{{messageerrors}}" />
    </source>
    <target>
        <x id="INTERPOLATION" equiv-text="{{messageerrors}}" />
    </target>  
<context-group purpose="location">
    <context context-type="sourcefile">src/app/components/login/login.component.html</context>
    <context context-type="linenumber">8</context>
</context-group>

this.messageerrors =“必须输入用户名”；应该显示错误消息为“法语中的nom d'utilisateur doitêtre请求”。

this.messageerrors =“必须输入电子邮件”；应该显示错误消息为 “发送电子邮件要求” enter code here

Answer 1

我从未真正在Angular中实现i18n，但已经阅读了大量文档，而我似乎还缺少Angular i18n工具。

首先，您需要为每个翻译版本构建并托管一个单独的应用程序副本。其次，就您的问题而言，它似乎仅适用于模板中的文本。在组件中翻译字符串变量似乎没有任何支持。这两个对我来说都是破坏交易的事情。

幸运的是，还有其他可用的i18n库，例如ngx-translate，它可以在一个应用程序中支持多种翻译，并具有管道，指令和服务，因此您可以翻译几乎所有想要的内容。

Answer 2

好的，谢谢您的时间，但是我实现了我自己的方法，我创建了一个json文件，其中包含源消息，语言键及其代表消息的列表（使用该语言），然后我创建了自定义管道并传递了json字符串和语言与源消息一起作为参数传递，并且可以正确地用于动态验证消息。

Answer 3

我们使用 transloco 来翻译应用程序中的每个字符串。我们开发了这个库来自动添加验证消息并翻译它们。

https://github.com/RiskChallenger/translation-validation

Angular 8中错误消息插值的国际化

3 个答案: