首页 > 解决方案 > 未从 JSON 模型加载的简单 OpenUI5 表

问题描述

在以我的方式调用 MII 查询和事务数据之前,尝试一些简单的示例以在 JSON 模型中显示数据。

我正在运行 MII v15.1.1.8,所以 SAPUI5 库大约有 3 年的历史。为了避免安装 NetWeaver 更新等,我只是下载了最新版本的 OpenUI5 库,我正在使用它。

我已成功创建了一个示例页面,其中包含按钮、输入字段和从 MII Illuminator 查询加载的下拉选择列表。现在我想在 sap.ui.table 控件中显示来自文件的 JSON 数据。

我从 OpenUI5 开发者网站 Grid table | 复制了示例。基本的。
当我启动页面时,我看到的只是标题,但没有行。加载时,我看到 7 行旁边有复选框和空列,然后它们消失了。

在 Chrome 中使用 UI5 Inspector 我看到了这些行,并深入了解它们附加到 JSON 模型,每个都有不同的行,正如预期的那样。如果我更改可见行数,那么闪烁的行数也会发生变化。

所以我觉得模型连接正确,XML 视图虽然简化,但与代码示例相似。

我可以将特定记录从模型写入控制台,再次确认模型不是问题。

作为 UI5 的新手,我确信这很简单,但我只是卡住了。

以下是涉及的各种文件。

myApp.irpt(.irpt 是类似于 HTML 的特殊 MII 扩展名)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>QC Adjstments</title>

    <script src="/sapui5/resources/sap/ui/thirdparty/openui5/openui5_1_56_10/resources/sap-ui-core.js"
        id="sap-ui-bootstrap"
        data-sap-ui-libs="sap.m,sap.ui.table"
        data-sap-ui-theme="sap_belize"
        data-sap-ui-compatVersion="edge"
        data-sap-ui-resourceroots='{
            "myApp": "./"
        }'>
    </script>

    <script>
        sap.ui.getCore().attachInit(function () {
            sap.ui.xmlview({
                viewName: "myApp.view.myApp"
            }).placeAt("content");
        });
    </script>
</head>    
<body>
<div id="content"></div>
</body>
</html>

myApp.controller.js

sap.ui.define(
    [
    'jquery.sap.global',
    "sap/ui/core/mvc/Controller",
    "sap/m/MessageToast",
    "sap/ui/model/json/JSONModel"
    ], 
    function ( jQuery, Controller, MessageToast, ODataModel, JSONModel ) 
    {
    "use strict";

    return Controller.extend("myApp.controller.myApp", 
    {
        onInit: function () 
        {
            // JSON model via MII query
            var oModel = new sap.ui.model.json.JSONModel();

            oModel.loadData( "./model/myModel.json" );

            // Assign model to the view
            this.getView().setModel( oModel, "myModel" );
            // Same results attaching model directly to the core        
            // sap.ui.getCore().setModel( oModel );


            // Use this function to write to console    
            oModel.attachRequestCompleted( function()
            {
                var sLineName = oModel.getProperty( "/Rowsets/Rowset/0/Row/5/prodDesc" );
                console.log( "Model product description: " + sLineName );
            });

        },

        onAfterRendering: function () 
        {
        },
    });
});

myapp.view.xml

<mvc:View
    controllerName="myApp.controller.myApp"
    xmlns="sap.ui.table"
    xmlns:mvc="sap.ui.core.mvc"
    xmlns:u="sap.ui.unified"
    xmlns:c="sap.ui.core"
    xmlns:m="sap.m"
    height="100%">
    <m:Page
        showHeader="false"
        enableScrolling="false"
        class="sapUiContentPadding">
        <m:content>
            <Table
                rows="{myModel>/Rowsets/Rowset/0/Row}"
                title="QC Adjustments"
                selectionMode="MultiToggle"
                visibleRowCount="7">
                <columns>
                    <Column width="11rem">
                        <m:Label text="Order Nbr" />
                        <template>
                            <m:Text text="{line}" wrapping="false" />
                        </template>
                    </Column>
                </columns>
            </Table>
        </m:content>
    </m:Page>
</mvc:View>

myModel.json

{ "Rowsets" : { 
    "DateCreated" : "2018-10-26T09:20:58", "Version" : "15.1 SP1 Patch 8 (Apr 19, 2016)", "StartDate" : "2018-10-26T08:20:58-0400", "EndDate" : "2018-10-26T09:20:58-0400", "CachedTime" : "", 
    "Rowset" : [ 
    { "Columns" : { 
        "Column" : [ 
        { "Name" : "cr_id", "SourceColumn" : "cr_id", "Description" : "cr_id", "SQLDataType" : -5, "MinRange" : 1.0, "MaxRange" : 1.0 }, 
        { "Name" : "line", "SourceColumn" : "line", "Description" : "line", "SQLDataType" : 12, "MinRange" : 1.0, "MaxRange" : 1.0 }, 
        { "Name" : "product", "SourceColumn" : "product", "Description" : "product", "SQLDataType" : 12, "MinRange" : 1.0, "MaxRange" : 1.0 }, 
        { "Name" : "prodDesc", "SourceColumn" : "prodDesc", "Description" : "prodDesc", "SQLDataType" : 12, "MinRange" : 1.0, "MaxRange" : 1.0 }, 
        { "Name" : "cookEnd", "SourceColumn" : "cookEnd", "Description" : "cookEnd", "SQLDataType" : 93, "MinRange" : 1.0, "MaxRange" : 1.0 }, 
        { "Name" : "adjMaterial", "SourceColumn" : "adjMaterial", "Description" : "adjMaterial", "SQLDataType" : 12, "MinRange" : 1.0, "MaxRange" : 1.0 }, 
        { "Name" : "adjDesc", "SourceColumn" : "adjDesc", "Description" : "adjDesc", "SQLDataType" : 12, "MinRange" : 1.0, "MaxRange" : 1.0 }, 
        { "Name" : "adjQty", "SourceColumn" : "adjQty", "Description" : "adjQty", "SQLDataType" : 8, "MinRange" : 1.0, "MaxRange" : 1.0 } ] }, 
    "Row" : [ 
        { "cr_id" : 4892534, "line" : "UL01", "product" : "152685", "prodDesc" : "PINEAPPLE", "cookEnd" : "10/23/2018 02:28:14", "adjMaterial" : "9808", "adjDesc" : "WATER", "adjQty" : 100.00 }, 
        { "cr_id" : 4893503, "line" : "UL01", "product" : "163491", "prodDesc" : "BANANA", "cookEnd" : "10/24/2018 03:34:25", "adjMaterial" : "112770", "adjDesc" : "CH SODIUM CITRATE PWD NOP", "adjQty" : 0.50 }, 
        { "cr_id" : 4893503, "line" : "UL01", "product" : "163491", "prodDesc" : "BANANA", "cookEnd" : "10/24/2018 03:34:25", "adjMaterial" : "112770", "adjDesc" : "CH SODIUM CITRATE PWD NOP", "adjQty" : 0.50 }, 
        { "cr_id" : 4894901, "line" : "UL01", "product" : "269320", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 04:14:42", "adjMaterial" : "9808", "adjDesc" : "WATER", "adjQty" : 100.00 }, 
        { "cr_id" : 4894901, "line" : "UL01", "product" : "269320", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 04:14:42", "adjMaterial" : "9808", "adjDesc" : "WATER", "adjQty" : 50.00 }, 
        { "cr_id" : 4894903, "line" : "UL01", "product" : "204752", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 06:33:19", "adjMaterial" : "9808", "adjDesc" : "WATER", "adjQty" : 100.00 }, 
        { "cr_id" : 4894904, "line" : "UL01", "product" : "204752", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 07:22:00", "adjMaterial" : "9808", "adjDesc" : "WATER", "adjQty" : 100.00 }, 
        { "cr_id" : 4894905, "line" : "UL01", "product" : "209053", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 08:31:51", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 0.50 }, 
        { "cr_id" : 4894905, "line" : "UL01", "product" : "209053", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 08:31:51", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 1.00 }, 
        { "cr_id" : 4894907, "line" : "UL01", "product" : "209053", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 10:09:22", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 1.50 }, 
        { "cr_id" : 4894908, "line" : "UL01", "product" : "209053", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 10:50:40", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 1.50 }, 
        { "cr_id" : 4894909, "line" : "UL01", "product" : "209053", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 11:37:38", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 1.50 }, 
        { "cr_id" : 4894910, "line" : "UL01", "product" : "209053", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 12:27:15", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 2.00 }, 
        { "cr_id" : 4894911, "line" : "UL01", "product" : "209053", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 13:12:15", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 1.50 }, 
        { "cr_id" : 4894912, "line" : "UL01", "product" : "209053", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 14:11:59", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 1.50 }, 
        { "cr_id" : 4894914, "line" : "UL01", "product" : "209053", "prodDesc" : "RASPBERRY", "cookEnd" : "10/25/2018 16:26:32", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 1.50 }, 
        { "cr_id" : 4892555, "line" : "UL02", "product" : "229822", "prodDesc" : "STRAWBERRY", "cookEnd" : "10/23/2018 03:33:39", "adjMaterial" : "9808", "adjDesc" : "WATER", "adjQty" : 100.00 }, 
        { "cr_id" : 4892559, "line" : "UL02", "product" : "229822", "prodDesc" : "STRAWBERRY", "cookEnd" : "10/23/2018 06:46:19", "adjMaterial" : "9808", "adjDesc" : "WATER", "adjQty" : 50.00 }, 
        { "cr_id" : 4892560, "line" : "UL02", "product" : "202388", "prodDesc" : "STRAWBERRY", "cookEnd" : "10/23/2018 07:40:57", "adjMaterial" : "9808", "adjDesc" : "WATER", "adjQty" : 100.00 }, 
        { "cr_id" : 4892561, "line" : "UL02", "product" : "202388", "prodDesc" : "STRAWBERRY", "cookEnd" : "10/23/2018 08:32:46", "adjMaterial" : "9808", "adjDesc" : "WATER", "adjQty" : 100.00 }, 
        { "cr_id" : 4892564, "line" : "UL02", "product" : "172510", "prodDesc" : "BLUEBERRY", "cookEnd" : "10/23/2018 11:26:31", "adjMaterial" : "9808", "adjDesc" : "WATER", "adjQty" : 75.00 }, 
        { "cr_id" : 4894950, "line" : "UL02", "product" : "252018", "prodDesc" : "BLUEBERRY", "cookEnd" : "10/26/2018 00:57:33", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 2.00 }, 
        { "cr_id" : 4894951, "line" : "UL02", "product" : "252018", "prodDesc" : "BLUEBERRY", "cookEnd" : "10/26/2018 01:46:21", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 1.00 }, 
        { "cr_id" : 4894951, "line" : "UL02", "product" : "252018", "prodDesc" : "BLUEBERRY", "cookEnd" : "10/26/2018 01:46:21", "adjMaterial" : "112764", "adjDesc" : "CH MALIC ACID DL GRAN", "adjQty" : 1.00 }, 
        { "cr_id" : 4894968, "line" : "UL03", "product" : "269318", "prodDesc" : "STRAWBERRY", "cookEnd" : "10/26/2018 01:30:32", "adjMaterial" : "115159", "adjDesc" : "STABILIZER", "adjQty" : 100.00 }, 
        { "cr_id" : 4894969, "line" : "UL03", "product" : "269318", "prodDesc" : "STRAWBERRY", "cookEnd" : "10/26/2018 02:21:04", "adjMaterial" : "115159", "adjDesc" : "STABILIZER", "adjQty" : 100.00 }, 
        { "cr_id" : 4895040, "line" : "UL03", "product" : "205553", "prodDesc" : "STRAWBERRY", "cookEnd" : "10/26/2018 08:11:31", "adjMaterial" : "112770", "adjDesc" : "CH SODIUM CITRATE PWD NOP", "adjQty" : 1.00 } ]
         } ]
     }
 }

标签: sapui5

解决方案


您必须在文本绑定中使用模型名称:

<m:Text text="{myModel>line}" wrapping="false" />


推荐阅读