Angular2 i18n for placeholder text

问题

Is there a way to translate the placeholder text for an input text field using Angular 2's i18n?

<input placeholder="hello world" i18n>

I don't see anything in the documentation about this: https://angular.io/docs/ts/latest/cookbook/i18n.html

回答1:

There has been an example, but I can't seem to find it anymore.

You should be able to use i18n-attributename. For example:

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

That would need an entry like this:

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

In your messages.xlf file. I couldn't get it to work without a translation though. So you will need to add the state=translated and a value.

Even if we don't give value in i18n-placeholder then it is also fine. just do like:

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

it will work fine.

回答2:

To add to the answer from @evandongen, here's where this is documented in the Angular docs:

Updated link:

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

Add i18n translation attributes

---

To mark an attribute for translation, add an attribute in the form of i18n-x, where x is the name of the attribute to translate. The following example shows how to mark the title attribute for translation by adding the i18n-title attribute on the img tag:

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

This technique works for any attribute of any element.

You also can assign a meaning, description, and id with the i18n-x="<meaning>|<description>@@<id>" syntax.

来源：https://stackoverflow.com/questions/40339109/angular2-i18n-for-placeholder-text