使用oDataModel的ui5 sap.m.table动态绑定

问题描述 投票:0回答:1

我在表格和数据方面苦苦挣扎,让我给您一些上下文信息,我使用的是1.72.3版本,我的应用程序是Nginx中托管的独立应用程序,所有代理均已安装到位并且可以正常工作。

我有一个像工作清单的视图(一个表的视图),我需要使用过滤器查询后端,但是JSONModel不允许,所以我的想法很简单

  • 我在JSONModel中创建了一个名为“ salesOrders”的道具
  • 使用事件attachPatternMatched,我使用oDataModel调用了后端
  • 我通过调用oDataModel的结果设置了属性“ salesOrders”
  • 我将表格绑定到属性

我放置了所有代码,但我在屏幕上获得的最佳结果是enter image description here

这是视图中我的表的定义。

<Table noDataText="Drop column list items here and columns in the area above" items="{salesOrderListView>/salesOrders}"
    id="tableSalesOrders" growingScrollToLoad="true" sticky="ColumnHeaders" growing="true">
    <items>
        <ColumnListItem type="Navigation" id="item0" press="onPressSalesOrder">
            <cells>
                <ObjectIdentifier xmlns="sap.m" title="{ path: 'Vbeln', formatter: '.formatter.numberNoZeros' }" titleActive="fasle" id="identifier0"/>
                <Link xmlns="sap.m" text="{Customer/Name1}" id="link0" press="onPressCustomer"/>
                <Link xmlns="sap.m" text="{Vendor/Ename}" id="link1" press="onPressVendor"/>
                <core:Icon src="sap-icon://flag" size="2em" id="icon0" color="{ path: 'Lsstk', formatter: '.formatter.flagStatusColorC' }"/>
                <core:Icon xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:core="sap.ui.core"
                    src="sap-icon://flag" size="2em" id="icon0_copy2" color="{ path: 'Cmgst', formatter: '.formatter.flagStatusColorCred' }"/>
                <core:Icon xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:core="sap.ui.core"
                    src="sap-icon://flag" size="2em" id="icon0_copy" color="{ path: 'Lfstk', formatter: '.formatter.flagStatusColor' }"/>
                <Text xmlns="sap.m" text="{Vdatu}" id="text1"/>
                <ObjectNumber xmlns="sap.m" number="{ path: 'Kwmeng', formatter: '.formatter.numberNoDecimals' }" unit="CJ" id="number0" textAlign="Center"/>
                <ObjectNumber xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="sap.m"
                    number="{ path: 'Kwmengdlvy', formatter: '.formatter.numberNoDecimals' }" unit="CJ" id="number0_copy2" textAlign="Center"/>
                <ObjectNumber xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="sap.m"
                    number="{ path: 'Kwmengdiff', formatter: '.formatter.numberNoDecimals' }" unit="CJ" id="number0_copy" textAlign="Center"/></cells>
        </ColumnListItem>
    </items>
    <columns>
        <Column id="column0">
            <header>
                <Label text="{i18n>vbelnLabel}" id="label0"/>
            </header>
        </Column>
        <Column id="column1" minScreenWidth="Large" demandPopin="true" popinDisplay="Inline">
            <header>
                <Label text="{i18n>customerName1Label}" id="label1"/>
            </header>
        </Column>
        <Column id="column2" minScreenWidth="Large" demandPopin="true" popinDisplay="Inline" popinHAlign="Left">
            <header>
                <Label text="{i18n>vendorEnameLabel}" id="label2"/>
            </header>
        </Column>
        <Column xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="sap.m" id="column2_copy6"
            demandPopin="true">
            <header>
                <Label text="Aprobación Comercial" id="label2_copy6" wrapping="true"/>
            </header>
        </Column>
        <Column xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="sap.m" id="column2_copy5"
            demandPopin="true">
            <header>
                <Label text="Aprobación Crediticia" id="label2_copy5" wrapping="true"/>
            </header>
        </Column>
        <Column xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="sap.m" id="column2_copy4"
            demandPopin="true">
            <header>
                <Label text="Expedición" id="label2_copy4"/>
            </header>
        </Column>
        <Column xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="sap.m" id="column2_copy2">
            <header>
                <Label text="{i18n>vdatuLabel}" id="label2_copy2" wrapping="true"/>
            </header>
        </Column>
        <Column xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="sap.m" id="column2_copy"
            minScreenWidth="Large" demandPopin="true" popinDisplay="Inline">
            <header>
                <Label text="{i18n>kwmengLabel}" id="label2_copy" wrapping="true"/>
            </header>
        </Column>
        <Column xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="sap.m" id="column2_copy7"
            demandPopin="true" minScreenWidth="Large" popinDisplay="Inline">
            <header>
                <Label text="{i18n>kwmengDlvyLabel}" id="label2_copy7" wrapping="true"/>
            </header>
        </Column>
        <Column xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="sap.m" id="column2_copy3">
            <header>
                <Label text="{i18n>kwmengDiffLabel}" id="label2_copy3" wrapping="true"/>
            </header>
        </Column>
    </columns>
    <headerToolbar>
        <Toolbar width="100%" id="toolbar1">
            <content>
                <Title id="SalesOrderListHeader" text="{salesOrderView>/salesOrderTableTitle}"/>
                <ToolbarSpacer/>
                <SearchField id="searchField" tooltip="{i18n>salesOrderSearchTooltip}" search="onSearch" width="auto"/>
            </content>
        </Toolbar>
    </headerToolbar>
</Table>

我的控制器中有这个

sap.ui.define([
    //  "sap/ui/core/mvc/Controller",
    "riders/polux/controller/BaseController",
    "sap/ui/model/json/JSONModel",
    "sap/ui/core/routing/History",
    "riders/polux/model/formatter"
], function (BaseController, JSONModel, History, formatter) {
    "use strict";
    return BaseController.extend("riders.polux.controller.SalesOrderList", {
        formatter: formatter,
        /**
         * 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 riders.polux.view.SalesOrderList
         */
        onInit: function () {
            var headerTitle, oViewModel, iOriginalBusyDelay, oTable = this.byId("tableSalesOrders");
            // Put down salesOrderList table's original value for busy indicator delay,
            // so it can be restored later on. Busy handling on the table is
            // taken care of by the table itself.
            iOriginalBusyDelay = oTable.getBusyIndicatorDelay();
            // Model used to manipulate control states
            oViewModel = new JSONModel({
                headerTitle: headerTitle,
                queryMode: "", //queryMode,
                tableBusyDelay: 0,
                salesOrders: null
            });
            this.getRouter().getRoute("SalesOrderList").attachPatternMatched(this._onObjectMatched, this);
            this.setModel(oViewModel, "salesOrderListView");
            // Make sure, busy indication is showing immediately so there is no
            // break after the busy indication for loading the view's meta data is
            // ended (see promise 'oWhenMetadataIsLoaded' in AppController)
            oTable.attachEventOnce("updateFinished", function () {
                // Restore original busy indicator delay for salesOrderList's table
                oViewModel.setProperty("/tableBusyDelay", iOriginalBusyDelay);
            });
            // Add the page to the flp routing history

        },
        _onObjectMatched: function (oEvent) {
            var oViewModel = this.getModel("salesOrderListView");
            var oTable = this.getView().byId("tableSalesOrders");
            var headerTitle, oResourceBundle = this.getResourceBundle();
            var queryMode = oEvent.getParameter("arguments").queryMode;
            switch (queryMode) {
            case "P":
                headerTitle = oResourceBundle.getText("salesOrderListViewTitleP");
                break;
            case "H":
                headerTitle = oResourceBundle.getText("salesOrderListViewTitleH");
                break;
            }
            oViewModel.setProperty("/headerTitle", headerTitle);
            this.addHistoryEntry({
                title: headerTitle,
                icon: "sap-icon://table-view",
                intent: "#PortalPollux-display&/SalesOrderList/" + queryMode
            }, true);
            var salesOrders = oViewModel.getProperty("/salesOrders");
            if (!salesOrders) {
                var odata = new sap.ui.model.odata.v2.ODataModel("/sap/opu/odata/sap/ZPOLLUX_SRV/");
                odata.read("/SalesOrderSet", {
                    success: function (oData, response) {
                        oViewModel.setData({
                            salesOrders: oData
                        }, true);
                    }
                });
            }
        },
        /*
         *@memberOf riders.polux.controller.SalesOrderList
         */
        onGoBack: function (oEvent) {
            //This code was generated by the layout editor.
            var oHistory = History.getInstance();
            var sPreviousHash = oHistory.getPreviousHash();
            // Go one screen back if you find a Hash
            if (sPreviousHash !== undefined) {
                window.history.go(-1);
            }
            // If you do not find a correct Hash, go to the Source screen using default router;
            else {
                var oRouter = sap.ui.core.UIComponent.getRouterFor(this);
                oRouter.navTo("TargetLaunchpad", true);
            }
        },
        onPressCustomer: function (oEvent) {
            // The source is the list item that got pressed - custom
            this._showObjectCustomer(oEvent.getSource());
        },
        onPressVendor: function (oEvent) {
            // The source is the list item that got pressed - custom
            this._showObjectVendor(oEvent.getSource());
        },
        onPressSalesOrder: function (oEvent) {
            // The source is the list item that got pressed - custom
            this._showObjectSalesOrder(oEvent.getSource());
        },
        _showObjectCustomer: function (oItem) {
            this.getRouter().navTo("customer", {
                objectId: oItem.getBindingContext().getProperty("Kunnr")
            });
        },
        _showObjectVendor: function (oItem) {
            this.getRouter().navTo("vendor", {
                objectId: oItem.getBindingContext().getProperty("Pernr")
            });
        },
        _showObjectSalesOrder: function (oItem) {
            this.getRouter().navTo("RouteSalesOrder", {
                objectId: oItem.getBindingContext().getProperty("Vbeln")
            });
        }

    });
});

我为此奋斗了两天,我可以找出我的错误在哪里。有人可以帮我吗?最好的问候,并提前感谢您>

我在表格和数据方面苦苦挣扎,请允许我给您一些上下文信息,我使用的是1.72.3版本,我的应用程序是Nginx中托管的独立应用程序,所有代理都已安装到位并且正在运行。 ..

binding sapui5 sap.m
1个回答
0
投票
  1. 您将items
© www.soinside.com 2019 - 2024. All rights reserved.