我们目前正在处理两个列表。一个是附件,另一个是时间轴。
两者都是列表(查看文件):
<IconTabFilter
icon="sap-icon://attachment"
key="AttachmentTab"
text="{i18n>Attachments}">
<List
id="AttachmentList"
includeItemInSelection="true">
</List>
</IconTabFilter>
<IconTabFilter
icon="sap-icon://work-history"
key="TimelineTab"
text="{i18n>History}">
<List
id="Timeline"
includeItemInSelection="true">
</List>
</IconTabFilter>
两者都使用类似的oData服务将数据绑定到视图。唯一的区别是CustomListItem。每个CustomListItem显示相同的信息。直接调用webservice时,我们会得到不同的条目。
我们也尝试使用StandardListItem,但都没有工作(控制器文件):
if (evt.getParameter("key") === "AttachmentTab") {
var template = new sap.m.StandardListItem({
type: "Active",
title: "{Objecttext}",
description: "{Filename}",
icon: {
path: "Type",
formatter: fis.eim.approval.util.Formatter.attachmentIcon
},
press: this.handleAttachmentPress
});
this.byId("AttachmentList").bindItems(
"/Invoices(id='" + id + "')/Attachments",
template
);
}
if (evt.getParameter("key") === "TimelineTab") {
var template = new sap.m.CustomListItem({
content: [
new sap.m.ObjectIdentifier({
title: "{Heading}"
}),
new sap.m.Text({
text: "{Text}"
})
]
});
this.byId("Timeline").bindItems({
path: "/Invoices(id='" + id + "')/Timeline",
template: template
});
}
虽然它不适用于历史时间表,但附件显示得很好。
我们不知道如何进一步调试该问题。关于bindItems函数可能出现什么问题的任何建议?
编辑:在bindItems()函数调用
之后的oData模型日志oData:
Approvals('0000000000014886'):
Approvals('0000000000015641'):
Approvals('0000000000016369'):
Approvals('0000000000016370'):
Approvals('0000000000016492'):
Attachments(id='foobar'):
Attachments(id='barfoo'):
Timeline(Belnr='',Gjahr='',Bukrs='',EdcObject=''):
LineItems(Id='0000000000000000',Rblgp='000005'):
LineItems(Id='0000000000016369',Rblgp='000002'):
LineItems(Id='0000000000016370',Rblgp='000003'):
LineItems(Id='0000000000016370',Rblgp='000004'):
有趣的是,所有其他oData调用都有参数,但没有时间轴。打开元素的子树时,我们可以看到所有其他时间轴条目多次重复的标题和文本。
所以问题是,其他时间轴条目在哪里?网络选项卡显示所有条目都已加载,并且只有最后一个json响应位于oData模型中。
亲切的问候,
迈克尔
答案 0 :(得分:1)
问题可能是(反直觉)Javascript scope for variables;它只有全局范围或功能范围,而不是块范围。
所以最可能的变量template
- 尽管在每个if
语句中定义 - 基本上只是每个列表的相同对象。
您可以尝试为第二个模板提供不同的变量名称。
编辑:嗯,你可能是对的......我用你的代码测试了它(相同的变量名),它似乎与使用虚拟数据的JSONModel一样好用,见下面的工作示例:
sap.ui.controller("view1.initial", {
onInit: function(oEvent) {
var oModel = new sap.ui.model.json.JSONModel();
oModel.setData({
Attachments: [{
"Objecttext": "Coretta",
"Filename": "Wagner"
}, {
"Objecttext": "Leo",
"Filename": "Smith"
}, {
"Objecttext": "Latasha",
"Filename": "Chavez"
}, {
"Objecttext": "Lavern",
"Filename": "Langfeldt"
}, {
"Objecttext": "Dale",
"Filename": "Santana"
}, {
"Objecttext": "Judy",
"Filename": "Ponthieux"
}, {
"Objecttext": "Alonzo",
"Filename": "Vanderlinden"
}, {
"Objecttext": "Lupita",
"Filename": "Mulvehill"
}, {
"Objecttext": "Polina",
"Filename": "Cowen"
}, {
"Objecttext": "Theresia",
"Filename": "Alvarez"
}],
Timeline: [{
"Heading": "Geoff",
"Text": "Popsikle"
}, {
"Heading": "Esperanza",
"Text": "Tupper"
}, {
"Heading": "Janelle",
"Text": "Proctor"
}, {
"Heading": "Maria",
"Text": "Kirchner"
}, {
"Heading": "Roberto",
"Text": "Dellinger"
}, {
"Heading": "Barkat",
"Text": "Parham"
}, {
"Heading": "Brandon",
"Text": "Holcombe"
}, {
"Heading": "Amela",
"Text": "Potate"
}, {
"Heading": "Eugene",
"Text": "Tang"
}, {
"Heading": "Kehinde",
"Text": "Clanton"
}]
});
this.getView().setModel(oModel);
},
handleIconTabBarSelect: function(evt) {
if (evt.getParameter("key") === "AttachmentTab") {
var template = new sap.m.StandardListItem({
type: "Active",
title: "{Objecttext}",
description: "{Filename}",
icon: "sap-icon://download"
});
this.byId("AttachmentList").bindItems(
"/Attachments",
template
);
}
if (evt.getParameter("key") === "TimelineTab") {
var template = new sap.m.CustomListItem({
content: [
new sap.m.ObjectIdentifier({
title: "{Heading}"
}),
new sap.m.Text({
text: "{Text}"
})
]
});
this.byId("Timeline").bindItems({
path: "/Timeline",
template: template
});
}
}
});
var app = new sap.m.App({});
var oView = sap.ui.xmlview({
viewContent: jQuery("#view1").html()
});
app.addPage(oView);
app.placeAt("uiArea");
&#13;
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>SAPUI5 template</title>
<script id="sap-ui-bootstrap" src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-xx-bindingSyntax="complex" data-sap-ui-libs="sap.m"></script>
<script id="view1" type="ui5/xmlview">
<mvc:View controllerName="view1.initial" xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc">
<IconTabBar id="idIconTabBar" select="handleIconTabBarSelect">
<items>
<IconTabFilter icon="sap-icon://attachment" key="AttachmentTab" text="Attachments">
<List id="AttachmentList" includeItemInSelection="true">
</List>
</IconTabFilter>
<IconTabFilter icon="sap-icon://work-history" key="TimelineTab" text="History">
<List id="Timeline" includeItemInSelection="true">
</List>
</IconTabFilter>
</items>
</IconTabBar>
</mvc:View>
</script>
</head>
<body class="sapUiBody" role="application">
<div id="uiArea"></div>
</body>
</html>
&#13;
也许你的ODataModel没有正确更新?如果在切换标签时加载了正确的数据,您是否可以使用浏览器中的网络选项卡进行检查?
答案 1 :(得分:0)
因为我们无法修复bindItems函数,所以我们使用oDataModel的read函数创建了一个变通方法。
this.getView().getModel().read(
"/Invoices(id='" + id + "')/Timeline",
{
success : (function(data) {
this.byId("Timeline").destroyItems();
data.results.forEach((function(text) {
var template = new sap.m.CustomListItem({
content: [
new sap.m.ObjectIdentifier({
title: text.Heading.trim()
}),
new sap.m.Text({
text: text.Text.trim()
})
]
});
template.addStyleClass("historyListItem");
this.byId("Timeline").addItem(template);
}).bind(this));
}).bind(this),
error : (function(error) {
this._showErrorMessage(error);
}).bind(this)
}
);
我们获取结果,并为每个数据条目创建一个CustomListItem,并使用addItem将其添加到列表中。在此之前我们调用destroyItems,否则它会在每次函数调用后再次添加相同的条目。
这不是我们所希望的解决方案,而是在我们找到更好的解决方案之前使其成功的替代方案。