How to get array length with Expression Binding?

Question

As the title implies, I do have the following data:

{
  "modelExample": [
    { "id": 0 },
    { "id": 1 },
    { "id": 2 }
  ]
}

The JSONModel has three entries, which essentially equates to 3 in length.

How do I get the length through an Expression Binding statement?

My Attempt:

<Text text="{ ${modelExample>/}.length}"

Does this answer your question? [Live Update the Number of Items](https://stackoverflow.com/questions/48308896/live-update-the-number-of-items) — Boghyon Hoffmann, May 13 '20 at 09:05

score 1 · Accepted Answer · answered May 21 '20 at 10:59

OK, here is a sample. Click on Run code snippet to see it in action:

sap.ui.require([
  "sap/ui/core/Core",
], Core => Core.attachInit(() => sap.ui.require([
  "sap/ui/core/Fragment",
  "sap/ui/model/json/JSONModel",
], async (Fragment, JSONModel) => {
  "use strict";
  
  // sample XML definition:
  const definition = '<ObjectStatus title="Length" text="{= ${/modelExample}.length}" class="sapMObjectStatusLarge sapUiTinyMargin" inverted="true" state="Information" xmlns="sap.m" />';
  const control = await Fragment.load({ definition });
  const model = new JSONModel({
    modelExample: [
      { id: 0, /*...*/},
      { id: 1, /*...*/},
      { id: 2, /*...*/},
    ],
  });

  control.setModel(model).placeAt("content");
})));

<script id="sap-ui-bootstrap" src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
  data-sap-ui-libs="sap.ui.core, sap.m"
  data-sap-ui-async="true"
  data-sap-ui-compatversion="edge"
  data-sap-ui-theme="sap_fiori_3"
  data-sap-ui-xx-waitfortheme="init"
></script>
<body id="content" class="sapUiBody"></body>

As you can see, I'm using text="{= ${/modelExample}.length}" which displays the correct length of the array:

If the model is named (e.g. "myModel"), it should be {= ${myModel>/modelExample}.length}.
Keep in mind that expression binding syntax requires {= (OneWay) or {:= (OneTime) at the beginning.
To actually make use of the expression binding, the bootstrap config bindingSyntax needs be set to "complex" or compatVersion to "edge", as mentioned in this post. E.g. in index.html:
```
<script id="sap-ui-bootstrap" data-sap-ui-compatversion="edge" ...>
```

How to get array length with Expression Binding?

1 Answers1