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