Angular Translate Parameters with Controller As Syntax

Question

I am using an Angular 1.5 component and trying to do an Angular Translate with parameters. Here is my markup:

Value is {{$ctrl.minFormatted}}
<div ng-message="dateRange" class="error-message">{{'invalidRange' | translate:'{ start: $ctrl.minFormatted, end: $ctrl.maxFormatted}'}}</div>

The message translates except it doesn't fill in the parameters. I verified $ctrl.minFormatted does have a value by displaying right above the translation.

In the past when I used a standard angular controller I used $scope.minFormatted. However this doesn't work since I'm using the controller as syntax

Ben Yitzhaki · Accepted Answer · 2016-11-11 15:11:47Z

2

as written in the documentation (https://angular-translate.github.io/docs/#/guide/06_variable-replacement), their best practice for using variables in the transalate filter would be passing a variables value to the filter from the scope. for example:

<div ng-message="dateRange" class="error-message">{{'invalidRange' | translate:$ctrl.translationValues}}</div>

define the value in the controller:

$scope.trasnlationValues = { "start": $ctrl.minFormatted, "end": $ctrl.maxFormatted};

a better way (and way more readable) of achieving the same would be using the translate-directive. for example:

<div ng-message="dateRange" class="error-message" **translate**="invalidRange" **translate**-values='{ start: $ctrl.minFormatted, end: $ctrl.maxFormatted}'></div>

would recommend you to explore their documentation for more details

answered Nov 11, 2016 at 15:11

Ben Yitzhaki

1,43617 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular Translate Parameters with Controller As Syntax

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related