实时更新项目数量 [英] Live Update the Number of Items

问题描述

我有一个需求，我需要将列表项的数量实时更新到 Page 的子标题.我想使用 sap.ui.base.EventProvider、聚合绑定或表达式绑定.请带我了解一下，因为我以前从未使用过它.

I have a requirement where I need to live update the number of list items to Page's sub-header. I want use sap.ui.base.EventProvider, aggregation binding, or expression binding. Please walk me through as I have never used it before.

如果我删除一个列表项，列表项的数量应该实时更新.

If I delete a list item, the number of list item should live update.

推荐答案

客户端模型

如果使用客户端模型，例如JSONModel(即假设所有数据都已在客户端上可用)并且目标集合是array，一个简单的表达式绑定就足够了:

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}"

• 示例 1(ClientModel): 从 sap.m.Table
中删除项目后更新计数
• 示例 2(ClientModel): 过滤后更新计数sap.ui.table.Table
• Sample 1 (ClientModel): Updating count after deleting items from sap.m.Table
• Sample 2 (ClientModel): Updating count after filtering sap.ui.table.Table

在上面的示例中可以看到，当item数量发生变化时，框架会通知表达式绑定，最终自动更新属性值.

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.

特别是如果启用了增长功能，此事件会派上用场，以始终获取框架分配给事件参数 total 的新计数值.

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.

[参数total]可以在成长属性设置为true时使用.

[The parameter total] can be used if the growing property is set to true.

• 示例 3 (v2.ODataModel):过滤后更新计数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
  // ...
},

updateFinished 事件在控件更新和处理项目绑定后触发.事件参数total"提供了根据过滤、排序等操作请求的$count的值.

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..

这个事件可以应用于任何绑定，特别是如果控件不支持updateFinished事件.

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() 返回结果为$count(或$inlinecount)对应的(List)Binding对象内部存储.我们可以通过调用 公共 API getLength().
• 一个缺点是原因sap.ui.model.ChangeReason" rel="nofollow noreferrer">sap.ui.model.ChangeReason.但是，如果控件可以增长，那么它很可能是从支持 updateFinished 事件的 ListBase 派生而来的.
• 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 API getLength().
• One downside is that there is no "growing" reason included in sap.ui.model.ChangeReason. But if the control can grow, it's probably derived from the ListBase anyway which supports the updateFinished event.

如果根本没有列表绑定但仍然需要计数值，我们可以随时手动发送请求以获取计数值.为此，将系统查询 $count 附加到 read 方法中的路径:

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

请查看文档主题绑定集合内联计数.

这篇关于实时更新项目数量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！