Web Module Internationalization
Modules Internalization development is based on i18n standard.
Message file organization
Each module containing UI messages should contain an i18n directory inside src catalog. i18n directory should contain catalogs for specific languages, for example: en_US.
-
For simple module, language directory should contain a single JSON file. These messages will be available in the module namespace: <module_name>/<filename>/KEY, eg. sabre-ngv-sample/translations/KEY.
-
For more complex modules, language directory can contain any number of JSON files and subdirectories. These messages will be available in the module namespace further organized in a reflecting way of the directory structure: <module_name>/<subdirectory>/<filename>/KEY.
Example
sabre-ngv-sample |
Usage
Usage in TypeScript view
It is reasonable to avoid globals inside of the modules. This is why there is no global t function in modules. t function has to be explicitly defined in module.
Example
import getService = app.getService;
import I18nService = app.services.impl.I18nService;
const t = getService(I18nService).getScopedTranslator('sabre-ngv-sample/translations');
export class Main extends Module {
init() {
const drawerConfig = new LargeWidgetDrawerConfig(SampleTile, "smapleData",
{
title: t('AMENITIES_CAPTION')
});
}
}Usage in templates
To use _t helper in handlebar templates used in modules, it has to be registered in view.
Example
import getService = app.getService;
import I18nService = app.services.impl.I18nService;
const i18nService: I18nService = getService(I18nService);
@Initial<AbstractViewOptions>({
templateOptions: {
helpers: {
_t: i18nService.getScopedHelper('sabre-ngv-sample/translations')
}
}
})