Client-side Models
If a client-side model such as JSONModel
is used (i.e. assuming all the data are already available on the client) and if the target collection is an array, a simple expression binding is sufficient:
title="{= ${myJSONModel>/myProducts}.length}"
- Sample 1 (ClientModel): Updating count after deleting items from
sap.m.Table
- Sample 2 (ClientModel): Updating count after filtering
sap.ui.table.Table
As you can see in the above samples, when the number of items changes, the framework notifies the Expression Binding which eventually updates the property value automatically.
Server-side Models (e.g. OData)
OData V2
Using updateFinished
event from sap.m.ListBase
api
Especially if the growing feature is enabled, this event comes in handy to get always the new count value which the framework assigns to the event parameter total
.
[The parameter
total
] can be used if thegrowing
property is set totrue
.
- Sample 3 (v2.ODataModel): Updating count after filtering
sap.m.ListBase
<List
growing="true"
items="{/Products}"
updateFinished=".onUpdateFinished"
>
onUpdateFinished: function(event) {
const reason = event.getParameter("reason"); // "Filter", "Sort", "Refresh", "Growing", ..
const count = event.getParameter("total"); // Do something with this $count value
// ...
},
The updateFinished
event is fired after items binding is updated and processed by the control. The event parameter "total"
provides the value of $count
that has been requested according to the operation such as filtering, sorting, etc..
Using change
event from sap.ui.model.Binding
api
This event can be applied to any bindings which comes in handy especially if the control doesn’t support the updateFinished
event.
someAggregation="{
path: '/Products',
events: {
change: '.onChange'
}
}"
onChange: function(event) {
const reason = event.getParameter("reason"); // See: sap.ui.model.ChangeReason
const count = event.getSource().getLength();
// ...
},
event.getSource()
returns the corresponding (List)Binding object which has the result of$count
(or$inlinecount
) stored internally. We can get that count result by calling the public APIgetLength()
.- One downside is that there is no
"growing"
reason included insap.ui.model.ChangeReason
. But if the control can grow, it’s probably derived from the ListBase anyway which supports theupdateFinished
event.
Manual trigger (Only in V2)
If there is no list binding at all but the count value is still required, we can always send a request manually to get the count value. For this, append the system query $count
to the path in the read method:
myV2ODataModel.read("/Products/$count", {
filters: [/*...*/],
success: function(data) {
const count = +data; // "+" parses the string to number.
// ...
}.bind(this),
})
OData V4
Please, take a look at the documentation topic Binding Collection Inline Count.