07. i18n and Multiple Languages

UI5 has built-in support for internationalization (i18n).
Depending on the language selected in the Fiori Launchpad for your user, the application will open in that language.

It is highly recommended to move all message texts/button labels and other UI elements to i18n files.

In your project directory, there is an i18n folder where different i18n files are listed. (The required file is selected based on the user's language settings. The file without a language code is used by default.)

Pasted%20image%2020250703142145

Contents of i18n files

For example, here are two files in English and German. The framework will automatically determine the required language from the settings and load the appropriate file with texts. Wherever this i18n key is referenced on the page, the correct value will be substituted.

Pasted%20image%2020250703142447

Pasted%20image%2020250703142451

It makes sense to group texts into namespaces to clarify their purpose.

Pasted%20image%2020250703142750

Declaring i18n in manifest.json

You can declare as many i18n directories as you want in the manifest. The main thing is that the model has a unique name and the type sap.ui.model.resource.ResourceModel

"sap.ui5": { 
        "models": {
            "i18n": {
                "type": "sap.ui.model.resource.ResourceModel",
                "uri": "i18n/i18n.properties"
            }
        }
}

Usage in view and controller

   <Button
        text="{i18n>SсanRequestTitle}"
        press="onScanRequest"
        type="Emphasized"
    />

// in BaseController.js
getI18nText(sKey){
    return this.getView().getModel("i18n").getResourceBundle().getText(sKey);
}

// in page controller

someMethod(){
    /// {... }
    const sText = this.getI18nText('some key');
}