占位符文本的 Angular2 i18n

Posted

技术标签:

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

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

<input placeholder="hello world" i18n>

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

【问题讨论】:

【参考方案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-placeholderplaceholder 才能工作。 它在文档拉取请求中已经有一段时间了,但我再也找不到它了..很高兴它有效! 有人帮忙解决这个问题吗,***.com/questions/57369486/…【参考方案2】:

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

更新链接:

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

添加 i18n 翻译属性


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

&lt;img [src]="logo" i18n-title title="Angular logo" /&gt;

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

您还可以使用 i18n-x="&lt;meaning&gt;|&lt;description&gt;@@&lt;id&gt;" 语法。

【讨论】:

【参考方案3】:

我使用了这个属性

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

【讨论】:

以上是关于占位符文本的 Angular2 i18n的主要内容,如果未能解决你的问题,请参考以下文章

缩小占位符文本后如何使占位符和文本框光标居中?

POWERPOINT中,在幻灯片的占位符中添加的文本有啥要求

PowerPoint2010占位符

Powerpoint2003中,在幻灯片的占位符中能添加的文中数字吗

将占位符添加到 UITextField,如何以编程方式快速设置占位符文本?

CKEditor 占位符角 2