How to use a filter inside translate-values attribute of angular translate

angularjs angular-translate
CodingBee picture CodingBee · Mar 22, 2016 · Viewed 11.2k times · Source

I am trying to use angular translate to display something like - Posted By John Doe on 1st Jan,2016 - where John Doe and 1st Jan,2016 are dynamic scope variables.

So, I have something like 

<p translate="TRANSLATION-STRING" translate-values='{ name: myname, date:mydate }'></p>

and translation string defined as TRANSLATION-STRING: "Posted on {{ name}} by {{date}}"

So far it is fine but what I have is a very long date and so i want to apply a date filter to the translate-value, something like

<p translate="TRANSLATION-STRING" translate-values='{ name: myname, date:mydate|date:'MMM dd , yyyy' }'></p>

This does not seem to work. How can a filter be applied in view and passed to angular translate value?

Answer

Brian Medendorp picture Brian Medendorp · Mar 29, 2016

I had the same issue, and it appears that using parenthesis around the individual data elements works. Try this:

<p translate="TRANSLATION-STRING" translate-values='{ name: myname, date: (mydate | date:'MMM dd , yyyy') }'></p>

Related questions

Correct use for angular-translate in controllers

I'm using angular-translate for i18n in an AngularJS application. For every application view, there is a dedicated controller. In the controllers below, I set the value to be shown as the page title. Code HTML <h1>{{ pageTitle }}&…

Read More
Exposing the current state name with ui router

I'm trying to implement a language switcher where if a user clicks on "de" from any given page on an "en" side - it takes them to that page of the "de" side. If I console.dir the $state parameter, …

Read More
Get current language with angular-translate

Is there a way to get the current used language in a controller (without $translateProvider)? Couldn't find anything in the $translate service.

Read More