sap.m.TileContainer仅显示2个Tiles

Question

我想使用sap.m.TileContainer来显示有一些信息的瓷砖。 SAP示例并不真正有用，因为它不遵循指南，例如使用manifest.json等...

所以我从头开始在SAP Web IDE中构建了一个应用程序。我正在使用TileContainer来显示瓷砖。它的tile聚合绑定到本地JSON数据文件。

数据文件包含一个包含三个项目的数组。但是，渲染后只显示两个。有什么建议吗？

这是我的data.json：

{
    "TileCollection": [{
        "title": "Slovenská Republika",
        "info": "support for SR",
        "flag": "",
        "icon": "sap-icon://inbox"
    }, {
        "title": "Deutschland",
        "info": "support for DE",
        "flag": "",
        "icon": "sap-icon://inbox"
    }, {
        "title": "Ceska Republika",
        "info": "support for CZ",
        "flag": "",
        "icon": "sap-icon://inbox"
    }]
}

这是我的XML视图：

<mvc:View
    controllerName="com.support_page.controller.App"
    height="100%"
    xmlns:mvc="sap.ui.core.mvc"
    xmlns:core="sap.ui.core"
    xmlns:tnt="sap.tnt"
    xmlns="sap.m">
    <Page
        showHeader="true"
        enableScrolling="false">
        <TileContainer
            id="container"
            tileDelete="handleTileDelete"
            tiles="{/TileCollection}">
            <StandardTile
                icon="{icon}"
                title="{title}"
                info="{info}"
                activeIcon="{flag}"/>
        </TileContainer>
    </Page>
</mvc:View>

Answer 1

非常感谢你的建议

与此同时，我也用瓷砖容器解决了它。

我做的是我使用的不是默认模型。我在component.js中初始化了模型，然后使用了模型> / TileCollection，虽然我仍然有点困惑但它仍然有效。尽管如此，谢谢你的回答。

Answer 2

I solved this issue , even i was facing same issue , If you dont use local model you will not face issue or if you define your model in controller you will not face the issue.
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/model/json/JSONModel"
], function(Controller,JSONModel) {
    "use strict";

    return Controller.extend("SmartPurchaseReq.controller.Home", {

        /**
         * 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 SmartPurchaseReq.view.Home
         */
            onInit: function() {
                var that = this;
                var data = {
    "TileCollection" : [
        {
            "icon" : "sap-icon://hint",
            "type" : "Monitor",
            "title" : "Tiles: a modern UI design pattern for overview & navigation."
        },
        {
            "icon" : "sap-icon://inbox",
            "number" : "89",
            "title" : "Approve Leave Requests",
            "info" : "Overdue",
            "infoState" : "Error"
        },
        {
            "type" : "Create",
            "title" : "Create Leave Requests",
            "info" : "28 Days Left",
            "infoState" : "Success"
        },
        {
            "icon" : "sap-icon://travel-expense-report",
            "number" : "281",
            "numberUnit" : "euro",
            "title" : "Travel Reimbursement",
            "info" : "1 day ago"
        },
        {
            "icon" : "sap-icon://loan",
            "number" : "2380",
            "numberUnit" : "euro",
            "title" : "My Salary",
            "info" : "8 days ago"
        },
        {
            "icon" : "sap-icon:`enter code here`//lab",
            "number" : "1",
            "numberUnit" : "Invention",
            "title" : "Test Lab Reports",
            "info" : "8 Days Ago"
        },
        {
            "icon" : "sap-icon://inbox",
            "type" : "Monitor",
            "title" : "Leave Request History"
        },
        {
            "type" : "Create",
            "title" : "Create Purchase Order",
            "info" : "890€ Open Budget",
            "infoState" : "Success"
        },
        {
            "icon" : "sap-icon://stethoscope",
            "number" : "3",
            "title" : "Yearly Health Check",
            "info" : "3 year overdue",
            "infoState" : "Error"
        },
        {
            "icon" : "sap-icon://meal",
            "type" : "Monitor",
            "title" : "Meal Schedule"
        }

    ]
};
                 var DummyModel = new JSONModel(); 
                 DummyModel.setData(data);
                // var sPath = jQuery.sap.getModulePath("model", "/Dummy.json");
                // var DummyModel = new JSONModel(sPath);
                that.getView().byId("container").setModel(DummyModel);
            },
            OnTilePress: function(evt) {
                var idj = evt.getSource();
                var d =5;
            }

        /**
         * Similar to onAfterRendering, but this hook is invoked before the controller's View is re-rendered
         * (NOT before the first rendering! onInit() is used for that one!).
         * @memberOf SmartPurchaseReq.view.Home
         */
        //  onBeforeRendering: function() {
        //
        //  },

        /**
         * Called when the View has been rendered (so its HTML is part of the document). Post-rendering manipulations of the HTML could be done here.
         * This hook is the same one that SAPUI5 controls get after being rendered.
         * @memberOf SmartPurchaseReq.view.Home
         */
        //  onAfterRendering: function() {
        //
        //  },

        /**
         * Called when the Controller is destroyed. Use this one to free resources and finalize activities.
         * @memberOf SmartPurchaseReq.view.Home
         */
        //  onExit: function() {
        //
        //  }

    });

});