I have an application shows German translations for some of the phrases, and English translations for other phrases.
However, if the browser language is English, every phrases show the English translations. This happens in IE browser.
It took me some time to figure out the puzzle as the cause of the issue is not obvious. Hope this blog will save you some time.
Usually, for accessing localized text, you provide property files with language code at the end of file names, for example: i18n_en.properties for English translations. Then you use Resource class to access the localized texts. For example:
var gLocale = sap.ui.getCore().getConfiguration().getLanguage();
var i18n = jQuery.sap.resources({
url : "i18n/i18n.properties",
locale : gLocale
});
sap.m.MessageToast.show(i18n.getText("ENTER_POSI_NUM"));
When the Resource class searching the translation based on UI5 derived browser language code, for example, de-DE(for German (Germany)), if the corresponding i18n_de-DE.properties doesn't exists, it will fetch the translation from i18n_de.properties file if it exists. It is special feature of the Resource class.
However, if you want to use the Formatter to display the translated phrase, the Formatter class don't have this feature. You have to set the language code specifically or add some logic to handle the scenario.
For example you phrase translation json data structure is like below.
"name":{
"de":"Diverses",
"en":"Miscellaneous"
}
You want to use a formatter to show the translation based on language code, the formatter function will need to make sure to cover the scenario such as de-DE.
For example,
getI18nName : function(name){
var i18nName = "";
var mainLangCode = gLocale.substring(0, 2);
if(name != undefined){
if(name[gLocale] != undefined && name[gLocale].length > 0){
i18nName = name[gLocale];
}else if(name[mainLangCode] != undefined && name[mainLangCode].length > 0){
i18nName = name[mainLangCode];
}else{
i18nName = name["en"];
}
}
return i18nName;
}
Now, even the UI5 derived browser language code is de-CH (for German (Switzerland)), you will have a catch all German translation for it.
Then in the view, you can use:
<core:Item text="{ path:'name', formatter:'util.UiDataFormatUtil.getI18nName'}" key="{id}" />
Thanks!
Siyu
