Playing with the model on SAP UI5

[Joseph_BERTHE]

The model is the most import component in SAP UI5 application. The purpose of this post is to show you how to use it in different manner.

Playing with Path

All example are based on this data source structure

{"menu": {

  "id": "file",

  "value": "File",

  "popup": {

    "menuitem": [

      {"value": "New", "onclick": "CreateNewDoc()"},

      {"value": "Open", "onclick": "OpenDoc()"},

      {"value": "Close", "onclick": "CloseDoc()"}

    ]

  }

}}

How to retrieve data from the model?

First, you have to find the model instance, then call the following method:

getProperty(sPath, oContext?)

sPath is important here, because it will indicate the wanted value.

Example 1: Get the value of value attribute

// Accès direct

Var oData = oModel.getProperty(« /menu/value ») ;

// Accès déroutée

Var oData = oModel.getProperty(“/menu”);

oData.value;

Example 2: Get the onClick value from the second line

// Accès direct

Var oData = oModel.getProperty(« /menu/popup/menuitem/1/onclick ») ;

// Accès dérouté

Var oData = oModel.getProperty(“/menu”);

oData.popup.menuitem[1].onclick;

How to write data into the model?

Example 3: Change the id value attribute

oModel.setProperty(« /menu/value », newValue);

How to loop inside a node?

Example 4: Loop inside menuitem node

var oData = oModel.getProperty(“/menu/popup/menuitem”);

If (oData instanceof Array){

  oData.foreach( function(oValue, i){

    //…

  });

}

Conclusion

Hope you will find those tips interesting.

Enjoy :wink: