Skip to content

Latest commit

 

History

History
37 lines (26 loc) · 1.29 KB

i18n.md

File metadata and controls

37 lines (26 loc) · 1.29 KB

Internationalization

The i18n of the application is managed by angular-gettext.

Adding translatable strings

In HTML code

Use the translate directive on an HTML element to automatically translate its content:

<span translate>This text will be translated.</span>

You can also use the translate filter if needed:

<button title="{{ 'Add item' | translate }}">+</button>

You should use it only when the translate directive is not applicable, as filters have a negative impact on performance if too many are used at the same time.

In JavaScript code

If you need to have translatable strings in JavaScript code, inject the gettext AngularJS dependency in wrap your string using the gettext() method:

var title = gettext('My page title');

Extracting strings to translate

Once you are ready to translate your app, just run the gulp translations:extract task. It will create a template.pot file in the sources/translations folder.

You can then use software like Poedit to generate the .po files for each of your supported languages, and put them in the sources/translations folder.

Do no forget to edit the main.constants.* file to add the supported languages of your application.