Mai 2023 - Cadaxo GmbH

Internationalization in UI5 – using i18n properties files – is the way to translate text into other languages. In this blog post I will share you the way, how to use i18n text with parameters in XML Views.

Define i18n File

/webapp/i18n/i18n.properties

textWithParameters=Hello my first name is {0}. And my last name {1}.

1	textWithParameters=Hello my first name is {0}. And my last name {1}.

Using in XML View

To display defined text with parameters you can use following snippet

<View xmlns:core="sap.ui.core">
<Page id="page" title="Cadaxo UI5 Snippets #1">
  <content>
    <Text core:require="{ formatMessage: 'sap/base/strings/formatMessage' }"
     text="{parts: ['i18n>textWithParameters', 'myModel>/firstName', 'myModel>/lastName'],
     formatter: 'formatMessage'
     } />
  </content>
</Page>
</View>

<Text core:require="{ formatMessage: 'sap/base/strings/formatMessage' }"

text="{parts: ['i18n>textWithParameters', 'myModel>/firstName', 'myModel>/lastName'],

formatter: 'formatMessage'

} />

</content>

</Page>

</View>

Set parameters in Controller

...
onInit: function () {
  const oView = this.getView();
  const oModel = oView.getModel("myModel");				
  oModel.setProperty("firstName", "Dusan" );
  oModel.setProperty("lastName", "Sacha" );
}
...

...

onInit: function () {

const oView = this.getView();

const oModel = oView.getModel("myModel");

oModel.setProperty("firstName", "Dusan" );

oModel.setProperty("lastName", "Sacha" );

}

...

Define JSON Model in manifest.json file

Do not forget to define ‚myModel‘ as it is not possible to input the parameter as a hard-coded strings. Either in the View or in manifest.json file

"models": {
  "i18n": {
    ...
  },
  "myModel": {
    "type": "sap.ui.model.json.JSONModel"
  }  
}

"models": {

"i18n": {

...

"myModel": {

"type": "sap.ui.model.json.JSONModel"

}

Let me know how you work with i18n parameters in Frontend or leave a comment if you found this blog post useful!

Monatsarchive: Mai 2023

Cadaxo UI5 Snippets #2 – i18n with parameters in XML View

Define i18n File

Using in XML View

Set parameters in Controller

Define JSON Model in manifest.json file