i18n

Internationalisation is one of the must have feature when building global reach mobile apps.

Appery.io provides built-in support i18n and l10n.
By default, every app with library from version 1.3 and higher has predefined AngularTranslate JavaScript assets.

define(['require', 'angular'], function(require, angular) {
    
    var module = angular.module('AngularTranslate', ['pascalprecht.translate']);
    
    module.config(
        
        ["$translateProvider", function($translateProvider) {
            $translateProvider.translations('en', {
                TITLE: 'Hello'
            });
            $translateProvider.translations('de', {
                TITLE: 'Hallo'
            });
            $translateProvider.preferredLanguage('en');
        }]);
    
});

Line 14 specifies the English language as default.

The following example specifies the German language as default.

$translateProvider.preferredLanguage('de');

New language can be added by analogy with English (en) and German (de) languages
Internalization messages and labels can be added by analogy with TITLE message.

On the app UI side internalization messages should have value by pattern {{ 'key' | translate }}

{{ 'TITLE' | translate }}
809

The following code sets the default language to German (de):

Apperyio.get("$translate").use("de");

📘

Want to know more?

You can also add the third-party internationalization (i18n) library to Ionic 5 projects. Learn how to do it to build our Ionic 5 Multilingual Sample App.