Question

我是SAPUI5的新手。目前我正在尝试创建一个简单的应用程序，显示基于表的报告，其中包含来自SAP系统（odata）的数据。我使用SAP Web IDE作为环境。

在第一次尝试中，我使用了标准控件sap.m.table。对我来说很好。现在我想为我的列使用一个简单的排序函数。因此我改为sap.ui.table（对于那种需要似乎有点好）。

启动应用程序时，只显示标题部分（标题），但我的表格没有显示。调试apploication会显示正确的数据绑定。变量oTable获取数据，即变量oJsonModel。显示我的桌子有什么缺失，为什么？ Chrome中的控制台不会抛出任何错误。

我的应用程序包含一个xml-view：

<mvc:View xmlns="sap.ui.table" xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns:u="sap.ui.unified" xmlns:m="sap.m"
xmlns:c="sap.ui.core" xmlns:html="http://www.w3.org/1999/xhtml" controllerName="Z_HCM_CICO_REP_2.controller.zbkTable">
        <m:Page title="{i18n>appTitle}" showHeader="true">
            <m:content>
                <Table id="zbkTable" rows="{/TimeEntrySet}">
                    <columns>
                        <Column id="pernr" sortProperty="pernr">
                            <m:Label text="{i18n>pernr}" textAlign="Center"/>
                            <template>
                                <m:Text text="{Pernr}"/>
                            </template>
                        </Column>
                        <Column id="ename" sortProperty="ename">
                            <m:Label text="{i18n>ename}" textAlign="Center"/>
                            <template>
                                <m:Text text="{Name}"/>
                            </template>
                        </Column>
                        <Column id="date" sortProperty="date">
                            <m:Label text="{i18n>date}" textAlign="Center"/>
                            <template>
                                <m:Text text="{Ldate}"/>
                            </template>
                        </Column>
                        <Column id="time" sortProperty="time">
                            <m:Label text="{i18n>time}" textAlign="Center"/>
                            <template>
                                <m:Text text="{Ltime}"/>
                            </template>
                        </Column>
                        <Column id="satza" sortProperty="satza">
                            <m:Label text="{i18n>satza}" textAlign="Center"/>
                            <template>
                                <m:Text text="{Ddtext}"/>
                            </template>
                        </Column>
                        <Column id="note" sortProperty="note">
                            <m:Label text="{i18n>note}" textAlign="Center"/>
                            <template>
                                <m:Text text="{NoticeText}"/>
                            </template>
                        </Column>
                    </columns>
                </Table>

            </m:content>
        </m:Page>

我的控制器编码如下：

sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/table/SortOrder",
    "sap/ui/model/Sorter"
], function(Controller, SortOrder, Sorter) {
    "use strict";

return Controller.extend("Z_HCM_CICO_REP_2.controller.zbkTable", {

    /**
     * Called when a controller is instantiated and its View controls (if available) are already created.
     * Can be used to modify the View before it is displayed, to bind event handlers and do other one-time initialization.
     * @memberOf Z_HCM_CICO_REP_2.view.zbkTable
     */
    onInit: function() {
        //load cicos
        var oJsonModel = new sap.ui.model.json.JSONModel();
        var oView = this.getView();
        var oModel = this.getOwnerComponent().getModel();
        var oTable = oView.byId("zbkTable");
        oTable.setModel(oJsonModel);
        // var that = this;

        oModel.read("/TimeEntrySet", {
            success: function(oData, oResponse) {
                oJsonModel.setData(oData);
                var aTimeList = oJsonModel.getData().results;
                $.each(aTimeList, function(index, value) {

                });
                //that.getOwnerComponent().setModel(oJsonModel);
            },
            error: function(oError) {

            }
        });
        oView.setModel(oJsonModel);
        //this.getOwnerComponent().setModel(oJsonModel);
        //oTable.bindItems("/TimeEntrySet");

        //Initial sorting
        var oDateColumn = oView.byId("date");
        //oView.byId("zbkTable").sort(oDateColumn, SortOrder.Ascending);
    }
});

我的组件编码是：

sap.ui.generic.app.AppComponent.extend("Z_HCM_CICO_REP_2.Component", {
metadata: {
    "manifest": "json"
    }
});

sap.ui.define([
    "sap/ui/core/UIComponent",
    "sap/ui/Device"
], function(UIComponent, Device) {
    "use strict";
return UIComponent.extend("Z_HCM_CICO_REP_2.Component", {

    /**
     * The component is initialized by UI5 automatically during the startup of the app and calls the init method once.
     * @public
     * @override
     */
    init: function() {
        // call the base component's init function
        UIComponent.prototype.init.apply(this, arguments);

        var oResourceModel = new sap.ui.model.resource.ResourceModel({
            bundleName: "Z_HCM_CICO_REP_2.i18n.i18n"
        });
        sap.ui.getCore().setModel(oResourceModel, "i18n");

        //load cicos
        var sServiceUrl = "/sap/opu/odata/sap/ZHCM_CICO_REP_SRV/";
        var oModel = new sap.ui.model.odata.v2.ODataModel(sServiceUrl, true);
        this.setModel(oModel);
    }
});

提前感谢和最好的问候

基督教

Answer 1

我没有阅读您的所有代码，但您在组件中定义了OData模型，然后在控制器中创建了另一个JSON模型。 JSON模型（设置为Table和视图的模型）具有您在'inside / TimeEntrySet'中读取的数据，因此我猜其中没有'/ TimeEntrySet'节点。只是孩子们的节点。所以你在'rows =“/ TimeEntrySet”中所做的绑定无法解决。

我认为您不需要复制数据在控制器中创建JSON模型。您应该能够访问在组件中定义的OData模型。

请您删除'onInit（）'函数中的所有代码，然后重试？

Answer 2

实际上拉斐尔的回答是对的。因为数据应该在服务器端排序，而不是客户端。这样你就不需要json模型了。但无论如何除了拉斐尔的回答，这应该可以解决问题：

oModel.read("/TimeEntrySet", {
        success: function(oData, oResponse) {
            oJsonModel.setProperty("/TimeEntrySet",oData.results);

您的行绑定现在可以正常工作。

sap.ui.table没有显示数据

2 个答案: