Question

我创建了一个sap.m.List，并使用P13n对话框对数据进行分组。当我使用格式化程序功能显示列表中项目的ID以在使用P13n对项目进行分组时删除其零值时，列表项目的格式化程序功能对组标题不起作用。

看看当前的图片：

有谁知道我们如何设置格式化程序来对列表中的标题进行分组？

Answer 1

使用sap.ui.model.Sorter的vGroup来指定您自己的分组逻辑，例如分组键和自定义分组标题。

请阅读并运行以下代码段。希望它有所帮助。

<html>
	<head>
		<meta http-equiv='X-UA-Compatible' content='IE=edge'>
		<meta charset="utf-8">

		<title>Mobile App with XML View with JSON Data</title>

		<script id='sap-ui-bootstrap'
				src='https://openui5.hana.ondemand.com/resources/sap-ui-core.js'
				data-sap-ui-theme='sap_belize'
				data-sap-ui-libs='sap.m'
				data-sap-ui-xx-bindingSyntax='complex'></script>

		<script id="myXml" type="text/xmldata">
			<mvc:View xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" controllerName="myController" displayBlock="true">
				<App>
					<Page title="Test">
						<List id="testList"
							items="{
								path: '/values',
								sorter: {
									path: 'id',
									descending: false,
									group:'.getGroup'
								}
							}"
							mode="MultiSelect">
							<StandardListItem
								title="{documentation}"
								 />
						</List>
					</Page>
				</App>
			</mvc:View>
		</script>

		<script>
			sap.ui.controller("myController", {
				onInit: function() {
					var data = {
						values: [
							{id:"0000129",  documentation: "123"},
							{id:"0000126",  documentation: "140"},
							{id:"0000127",  documentation: "141"},
							{id:"0000126",  documentation: "145"},
							{id:"0000127",  documentation: "161"}
						]
					};

					// create a Model with this data
					var model = new sap.ui.model.json.JSONModel();
					model.setData(data);
					
					this.getView().byId("testList").setModel(model); 
					
				},
				
				getGroup : function(oContext) {
					var name = oContext.getProperty("id");
					return {
						key: name,
						text: "Custom Title " +name.replace(/^[0]+/g,"")
					};
				}
			});
			sap.ui.xmlview({ viewContent: jQuery('#myXml').html() }).placeAt("content");
		</script>

	</head>
	<body id='content' class='sapUiBody'>
	</body>
</html>

Answer 2

我终于找到了如何将vGroup用于智能表：

问题

如何设置类型为ResponsiveTable（sap.m.Table）的SmartTable中显示的组标题？当在响应表类型的SmartTable中完成分组时，为什么显示技术键而不是描述？

答案：

在ResponsiveTable中进行分组是通过对表条目进行排序来完成的。您可以通过为第一个分拣机指定组功能，在ResponsiveTable中为组标题定义自己的格式。

有关如何执行此操作的详细信息，请参阅示例。

使用SmartTable控件时，您可以使用beforeRebindTable事件并使用bindingParams（事件参数）获取可用的排序器。检查那里的第一台分拣机是否有一个组。

onBeforeRebindTable: function(oEvent) {
    var mBindingParams = oEvent.getParameter("bindingParams");
    var oSorter = mBindingParams.sorter[0];
 //Check if sorter is for Grouping
    if(oSorter.vGroup){

有两种选择。第一个选项如下所示：

//Replace the Group function
        oSorter.fnGroup = this.mGroupFunctions[oSorter.sPath];

您还可以执行以下操作：

//Replace the Grouping sorter itself        
        mBindingParams.sorter[0] = new Sorter(oSorter.sPath, bDescending, this.mGroupFunctions[oSorter.sPath]);
 }

来源：https://sapui5.hana.ondemand.com/#/topic/bed8274140d04fc0b9bcb2db42d8bac2

SAPUI5：如何在进行分组时为P13n项设置格式化程序？

2 个答案: