占位符文本的 Angular2 i18n答案

【问题标题】：Angular2 i18n for placeholder text占位符文本的 Angular2 i18n
【发布时间】：2017-03-13 08:31:04
【问题描述】：

有没有办法使用 Angular 2 的 i18n 翻译输入文本字段的占位符文本？

<input placeholder="hello world" i18n>

我在文档中没有看到任何关于此的内容： https://angular.io/docs/ts/latest/cookbook/i18n.html

【问题讨论】：

标签： angular input internationalization placeholder

【解决方案1】：

有一个例子，但我似乎找不到了。

您应该可以使用i18n-attributename。例如：

<input type="number" placeholder="From" i18n-placeholder="From placeholder"/>

这需要这样的条目：

<trans-unit id="generatedId" datatype="html">
  <source>From</source>
  <target state="translated">Van</target>
  <note priority="1" from="description">From placeholder</note>
</trans-unit>

在您的 messages.xlf 文件中。不过，如果没有翻译，我无法让它工作。所以你需要添加 state=translated 和一个值。

即使我们不在 i18n-placeholder 中赋予价值，那也没关系。喜欢就好：

<input type="number" placeholder="From" i18n-placeholder/>

它会正常工作的。

【讨论】：

谢谢。我没有意识到你需要 i18n-placeholder 和 placeholder 才能工作。
它在文档拉取请求中已经有一段时间了，但我再也找不到它了..很高兴它有效！
有人帮忙解决这个问题吗，stackoverflow.com/questions/57369486/…

【解决方案2】：

为了补充来自@evandongen 的答案，这里是 Angular 文档中记录的位置：

更新链接：

https://angular.io/guide/i18n#translate-attributes

添加 i18n 翻译属性

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

<img [src]="logo" i18n-title title="Angular logo" />

此技术适用于 any 元素的任何属性。

您还可以使用 i18n-x="<meaning>|<description>@@<id>" 语法。

【讨论】：

【解决方案3】：

我使用了这个属性

 <input type="submit" value="{{ 'LOGIN.LOG' | translate }}">

【讨论】：