Question

I am using angular-translate and need to make date/time localization.

Therefore I need to apply time format filters (angular-moment) on filter arguments for the angular-translate filter which does variable replacement.

But this should be a general issue/use case independent of angular-translate and angular-moment.

Without the argument filtering it works (but then i have no localised time format):

<div data-ng-repeat="msg in data.messages">;
   {{msg.text | translate:{timestamp: msg.timestamp } }}
</div>

Doesn't work:

<div data-ng-repeat="msg in data.messages">
  {{msg.text | translate:{timestamp: msg.timestamp | amDateFormat:'LT'} }}
</div>

is producing a syntax error:

Error: [$parse:syntax] Syntax Error: Token '|' is unexpected, expecting [}] at column 73 of the expression [msg.text | translate:{timestamp: msg.timestamp | amDateFormat:'LT' } ] starting at [| amDateFormat:'LT' } ].
http://errors.angularjs.org/1.2.15/$parse/syntax?

2nd guess also doesn't work:

<div data-ng-repeat="msg in data.messages">
 {{msg.text | translate:{timestamp: {msg.timestamp | amDateFormat:'LT'} } }}
</div>

is producing a syntax error:

Error: [$parse:syntax] Syntax Error: Token '|' is unexpected, expecting [}] at column 74 of the expression [msg.text | translate:{timestamp: {msg.timestamp | amDateFormat:'LT'} } ] starting at [| amDateFormat:'LT' } } ].
http://errors.angularjs.org/1.2.15/$parse/syntax?

I am using AngularJS 1.2.15.

Was it helpful?

Solution

For future reference - you need to add parentheses around the expression, like so:

<div data-ng-repeat="msg in data.messages">
  {{msg.text | translate:{ timestamp: (msg.timestamp | amDateFormat:'LT') } }}
</div>

This being the relevant part: (msg.timestamp | amDateFormat:'LT')

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top