Search code examples
angularinputinternationalizationplaceholder

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

Solution

  • 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.