0

我们目前正在处理两个列表。一个是附件，另一个是时间线。

两者都是列表（查看文件）：

<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 显示相同的信息。当直接调用 web 服务时，我们会得到不同的条目。

我们也使用 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 模型中。

亲切的问候，

迈克尔

4

2 回答 2

1

问题可能是变量的（违反直觉的）Javascript 范围；它只有全局作用域或函数作用域，没有块作用域。

所以最有可能的变量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");
<!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>

也许您的 ODataModel 没有正确更新？如果在切换选项卡时加载了正确的数据，您能否检查浏览器中的网络选项卡？

于 2015-03-30T14:03:50.397 回答
0

因为我们无法修复 bindItems 函数，所以我们使用 oDataModel 的读取函数创建了一个解决方法。

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，否则它会在每次函数调用后再次添加相同的条目。

这不是我们想要的解决方案，而是在我们找到更好的解决方案之前让它发挥作用的替代方案。

于 2015-03-31T14:01:10.510 回答