I'm using angular-translate to translate the page content in to different languages.
<input type ='text' placeholder = ' {username | translate}'>
This works fine when the page loads ..but it fails to translate when I use $translate.uses('fr') depending upon language dropdown changes.
Can any one kindly suggests the solution to translate the placeholders while the language changes dynamically ?
Did you try:
<input type="text" placeholder="{{ 'my.i18n.key' | translate }}" ng-model="myModel">
There is a directive in angular-translate to help with this. See this issue.
<input placeholder="Regular Placeholder" translate translate-attr-placeholder="text" translate-value-browser="{{app.browser}}">
Here is a preview of a working plunkr from that thread: http://plnkr.co/edit/J4Ai71puzOaA0op7kDgo?p=preview
+ira 's solution works for me.
<input type ='text' placeholder = "{'USERNAME' | translate}">
where username is the key for the translation. So that translation JSON line might look like the following in Spanish
"USERNAME": "Nombre",
The two together puts Nombre as a placeholder inside the input box
I Use this method:
In en.json:
{
"ENTER_TEXT": "{{label}} را وارد کنید",
"DISCOUNT_CODE": "کد تخفیف"
}
In template:
<input type="text" placeholder="{{'ENTER_TEXT' | translate: {label: 'DISCOUNT_CODE' | translate} }}" >
来源：https://stackoverflow.com/questions/21025277/how-to-translate-the-html5-placeholders-dynamically