Angular multilanguage app Angular multilanguage app json json

Angular multilanguage app


Angular-translate can help you internationalizing client-side strings.

How does it work

In short, you have to feed the $translationProvider with a json containing your translations:

$translateProvider.translations('en', {    'home.title': 'Welcome in my app',    'button.cancel': 'Cancel'});

and then use the translate filter:

<h1>{{'home.title' | translate}}</h1><h1>{{::'home.title' | translate}}</h1> <!-- one-time binding with angular 1.3+ -->

or the directive

<h1 translate="home.title"></h1><h1 translate>home.title</h1>

In terms of performance prefer one of the last three syntaxes. The first one, {{'home.title' | translate}}, keeps watchers in memory.Refer to the documentation for the other features of angular-translate. Here is the getting-started guide.


Translation of the strings of the JSON you posted

Seeing the json you posted makes me think that you want to translate some service-specific strings. Their translation should be done in the back-end, i.e. the server should return the translated text according to the chosen language.