关于 SAP UI5 OData V4 模型的 Property Binding 使用介绍

本文涉及的产品
可视分析地图(DataV-Atlas),3 个项目,100M 存储空间
数据可视化DataV,5个大屏 1个月
简介: 关于 SAP UI5 OData V4 模型的 Property Binding 使用介绍

Property binding 和一个对象的值关联。

下面的例子:使用控制器方法 formatPhoneNumbersAsCSV 显示业务合作伙伴联系人的电话号码列表,以逗号分隔:

<SimpleForm binding="{/BusinessPartnerList('42')}">
  <Label text="Phone number list" />
  <Text text="{path : 'BP_2_CONTACT', mode : 'OneTime', targetType : 'any', formatter : '.formatPhoneNumbersAsCSV'}" />
</SimpleForm>

上面 XML 视图里,在 Text 控件里,显示 id 为 42 的 Business Partner 模型的属性值 BP_2_CONTACT,并且用自定义格式器 .formatPhoneNumbersAsCSV 在电话号码之间加上逗号分隔符。


OData V4 模型根据控件或应用程序请求的数据范围,自动确定系统查询选项 $top 和 $skip.


在下面的示例中,生成的第一个请求是 GET People(‘angelhuffman’)/Friends?KaTeX parse error: Expected 'EOF', got '&' at position 15: expand=Friends&̲skip=0&$top=107。 $top 的值是根据请求数据的长度 (7) 加上控件提供的预取大小 (100) 计算得出的。

<table:Table id="PeopleTable" width="auto" title="People" visibleRowCount="7"
        rows="{
            path:'/People(\'angelhuffman\')/Friends',
            parameters: {
                $expand:'Friends'
            }
        }">
    <table:columns>
    ...
    </table:columns>
</table:Table>

另一种分页机制是服务器驱动分页,服务器只返回请求数据的一部分以限制响应大小。 自 SAPUI5 1.72 起,OData V4 模型支持此机制。该模型会将检索到的数据与对控件或应用程序的响应一起提供。 后续请求不会再自动触发,只有在控件或应用程序向模型请求附加数据时才会触发。


只有 list 和 context binding 支持 OData 系统查询选项 a p p l y 、 apply、apply、count、e x p a n d 、 expand、expand、filter、o r d e r b y 、 orderby、orderby、search 和 $select,property binding 不支持。


使用 JavaScript 进行数据绑定的例子:

oView.byId("SalesOrderTable").bindItems({
    path : "/SalesOrderList",
    parameters : {
        "$count" : true,
        "$expand" : {
            "SO_2_SOITEM" : {
                "$orderby" : "ItemPosition",
                "$select" : ["ItemPosition", "Quantity", "QuantityUnit", "SalesOrderID"]
            }
        },
        "$filter" : "BuyerName ge 'M'",
        "$orderby" : "GrossAmount desc",
        "$select" : ["BuyerName", "CurrencyCode", "GrossAmount", "Note", "SalesOrderID"]
    }
});

使用 XML 视图进行数据绑定的例子:

<Table growing="true" growingThreshold="5" id="SalesOrders"
    items="{
            path : '/SalesOrderList',
            parameters : {
                $count : true,
                $expand : 'SO_2_BP',
                $filter : 'BuyerName ge \'M\'',
                $orderby : 'GrossAmount desc',
                $select : 'BuyerName,CurrencyCode,GrossAmount,Note,SalesOrderID'
            },
        }">

$expand 不仅仅可以是字符串,也可以是一个 JSON 对象:

<Table growing="true" growingThreshold="5" id="SalesOrders"
    items="{
            path : '/SalesOrderList',
            parameters : {
                $count : true,
                $expand : {
                       'SO_2_SOITEM' : {
                               '$orderby' : 'ItemPosition',
                               '$select' : ['ItemPosition','Quantity','QuantityUnit','SalesOrderID']
                       }
               },
                $filter : 'BuyerName ge \'M\'',
                $orderby : 'GrossAmount desc',
                $select : ['BuyerName','CurrencyCode','GrossAmount','Note','SalesOrderID']
            },
        }">

OData V4 模型允许绑定由参数 $count 设置为 true 的 ODataListBinding 读取的实体集合的内联计数。不活跃的上下文(也就是说,没有显示在当前列表控件里的记录)不影响这个计数;


在下面的示例中,表标题绑定到 $count,因此表示绑定到表的集合中的销售订单实体的数量。

<Table id="SalesOrders"
    items="{
        path : '/SalesOrderList',
        parameters : {
            $count : true,
        }
    }"
>
    <headerToolbar>
        <Toolbar>
            <content>
                <Title id="SalesOrdersTitle" text="{$count} Sales Orders"/>
            </content>
        </Toolbar>
    </headerToolbar>
    ...
</Table>
相关实践学习
DataV Board用户界面概览
本实验带领用户熟悉DataV Board这款可视化产品的用户界面
阿里云实时数仓实战 - 项目介绍及架构设计
课程简介 1)学习搭建一个数据仓库的过程,理解数据在整个数仓架构的从采集、存储、计算、输出、展示的整个业务流程。 2)整个数仓体系完全搭建在阿里云架构上,理解并学会运用各个服务组件,了解各个组件之间如何配合联动。 3&nbsp;)前置知识要求 &nbsp; 课程大纲 第一章&nbsp;了解数据仓库概念 初步了解数据仓库是干什么的 第二章&nbsp;按照企业开发的标准去搭建一个数据仓库 数据仓库的需求是什么 架构 怎么选型怎么购买服务器 第三章&nbsp;数据生成模块 用户形成数据的一个准备 按照企业的标准,准备了十一张用户行为表 方便使用 第四章&nbsp;采集模块的搭建 购买阿里云服务器 安装 JDK 安装 Flume 第五章&nbsp;用户行为数据仓库 严格按照企业的标准开发 第六章&nbsp;搭建业务数仓理论基础和对表的分类同步 第七章&nbsp;业务数仓的搭建&nbsp; 业务行为数仓效果图&nbsp;&nbsp;
相关文章
|
4月前
|
Dart Serverless Android开发
Flutter 单线程模型保证UI运行流畅
Flutter 单线程模型保证UI运行流畅
66 0
|
5月前
|
安全 API 数据库
SAP ABAP OData 中 Function import 的概念介绍
SAP ABAP OData 中 Function import 的概念介绍
|
5月前
|
前端开发 数据库 开发者
如何在 SEGW 事务码里为 SAP ABAP OData 服务实现 Function Import 试读版
如何在 SEGW 事务码里为 SAP ABAP OData 服务实现 Function Import 试读版
SAP ABAP OData 服务里需要指定 guid 类型的请求参数时,正确语法是什么?
SAP ABAP OData 服务里需要指定 guid 类型的请求参数时,正确语法是什么?
|
5月前
|
JSON 应用服务中间件 API
使用 ABAP 代码消费 SAP 系统的 OData 服务
使用 ABAP 代码消费 SAP 系统的 OData 服务
关于 SAP ABAP OData 服务如何实现 Deep Insert 场景 - SAP 应用的标准行为试读版
关于 SAP ABAP OData 服务如何实现 Deep Insert 场景 - SAP 应用的标准行为试读版
|
5月前
|
机器学习/深度学习 人工智能 自然语言处理
【AI大模型应用开发】3.2 RAG实战 - RAG应用+UI实现加载本地文件并对话
【AI大模型应用开发】3.2 RAG实战 - RAG应用+UI实现加载本地文件并对话
190 0
|
5月前
|
前端开发 搜索推荐 开发者
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
|
5月前
|
JavaScript 前端开发 开发者
SAP UI5 控件 sap.m.ListBase 的 inset 属性的作用介绍
SAP UI5 控件 sap.m.ListBase 的 inset 属性的作用介绍
|
5月前
|
前端开发 JavaScript API
SAP UI5 sap.ui.require.toUrl 的作用介绍
SAP UI5 sap.ui.require.toUrl 的作用介绍