Binding nested JSON to XML View

Question

This is the example I'm trying to make work:

Manifest model declaration:

"models": {
   "caixas": {
        "type": "sap.ui.model.json.JSONModel",
        "uri": "Caixas.json"
    }
}

Caixas.json file:

{"Caixas": [
    {
        "NomeCaixa": "PETROBRAS",
        "Valores": [
            {
                "LabelValor": "Saldo Inicial",
                "ValorValor": 3520,
                "MoedaValor": "JPY"
            },
            {
                "LabelValor": "Entrada",
                "ValorValor": 3520,
                "MoedaValor": "JPY"
            }
        ]
    },
    {
        "NomeCaixa": "PEBEM",
        "Valores": [
            {
                "LabelValor": "Saldo Inicial",
                "ValorValor": 3520,
                "MoedaValor": "JPY"
            },
            {
                "LabelValor": "Entrada",
                "ValorValor": 3520,
                "MoedaValor": "JPY"
            }
        ]
    }
]}

The problem is:

I have a SplitApp where the master page is binding to "Caixas" level of the Caixas.json file. This part is working.

When I click at the master page to select one of the items, the details page should show the details of the currently selected "Caixas". This is working for the attribute "NomeCaixa", since it's directly related to "Caixas" level.

The thing is that I would like to display a list with the data inside "Valores" array for the selected Caixa.

If I bind to a harcoded "Caixas" like in:

<List id="caixasList" 
      class="sapUiResponsiveMargin"
      headerText="Caixas" 
      width="auto" 
      mode="SingleSelectMaster"
      items="{caixas>/Caixas/0/Valores}">
    <items>
        <ObjectListItem title="banana" />
    </items>
</List>

it works fine, but it always will show the first "Caixas" "Valores" array values.

I wish to write a path in the items attribute of the element List so that it displayed the "Valores" array values of the currently selected "Caixas" on the master page.

I've tried several combinations using >/ etc and also tried finding a comprehensive guide for this path syntax, but could not get any help.

Can you please, help me?

Answer 1

You need to bind your detail page to the currently selected "Caixas" object via "bindObject". Then from now on, you are able to define relative binding on the detail page, it will look like this:

items="{caixas>Valores}"

in this line, "caixas" means the name of the model, but not the name of the property in JSON source data.