Angular translate with parameters

Question

I am trying to "translate" my angular application using angular-translate. But I am stuck with paramaterized translation in a plural.

index.html includes:

<script src="assets/libs/angular-1.5.7/angular.js"></script>
<script src="assets/libs/angular-1.5.7/angular-message-format.js"></script>
<script src="assets/libs/message-format-1.0.0-rc3/messageformat.js"></script>
<script src="assets/libs/angular-translate-2.11.1/angular-translate.js"></script>
<script src="assets/libs/angular-translate-2.11.1/angular-translate-loader-static-files.js"></script>
<script src="assets/libs/angular-translate-2.11.1/angular-translate-interpolation-messageformat.js"></script>

Then, I configure angular-translate:

angular.module('app').config(['$translateProvider', function ($translateProvider) {

    // Language files folder definition
    $translateProvider.useStaticFilesLoader({
        prefix: 'app/resources/locale-',
        suffix: '.json'
    });

    // Default language
    $translateProvider.preferredLanguage('fr_FR');

    // TODO does logging missing key to console should be activated in production?
    $translateProvider.useMissingTranslationHandlerLog();

    //$translateProvider.useMessageFormatInterpolation();

    // Force not using sanitizer (to avoid security warning)
    $translateProvider.useSanitizeValueStrategy(null);
}])

Then, i define some translation keys in a static file:

{   
    "drivers.results.noresult" : "No result",
    "drivers.results.oneresult" : "One result",
    "drivers.results.nresults" : "{{length}} results"
}

And I try to translate a message with the plural syntax:

{{ nbResults, plural,
    =0 { {{'drivers.results.noresult' | translate}} }
    =1 { {{'drivers.results.oneresult' | translate}} }
    other { {{'drivers.results.nresults' | translate:'{length: nbResults }' }} }
}}

When nbResults=0 or 1, everything is ok, I got the correct message. But, in other case, example if nbResults=10, the length is not injected into the message key. And the message displayed is only "results" instead of "10 results".

Note: if I change the last line to

other { {{'drivers.results.nresults' | translate:'{length: 10 }'

I've got the message 10 results.

Answer 1

I finally find the solution of this problem.

So the language key is still:

"drivers.results.nresults" : "{{length}} results"

Static parameter

This is working fine with a static value: (note the simple quotes)

{{ nbResults, plural,
    =0 { {{'drivers.results.noresult' | translate}} }
    =1 { {{'drivers.results.oneresult' | translate}} }
    other { {{'drivers.results.nresults' | translate:'{length: 123 }' }} }
}}

Dynamic parameter

But if I want something dynamic, I need to write this (without quote):

{{ nbResults, plural,
    =0 { {{'drivers.results.noresult' | translate}} }
    =1 { {{'drivers.results.oneresult' | translate}} }
    other { {{'drivers.results.nresults' | translate:{length: nbResults } }} }
}}

And it will replace correctly the length parameter in the translation!