Sapui5 sap.m.TileContainer仅显示2个磁贴
我想用一些信息来显示瓷砖。SAP示例并非真正有用,因为它没有遵循诸如使用manifest.json等准则 因此,我从头开始在SAP Web IDE中构建了一个应用程序。我正在使用TileContainer显示瓷砖。它的Sapui5 sap.m.TileContainer仅显示2个磁贴,sapui5,sap-web-ide,Sapui5,Sap Web Ide,我想用一些信息来显示瓷砖。SAP示例并非真正有用,因为它没有遵循诸如使用manifest.json等准则 因此,我从头开始在SAP Web IDE中构建了一个应用程序。我正在使用TileContainer显示瓷砖。它的tile聚合绑定到本地JSON数据文件 数据文件包含一个包含三项的数组。但是,渲染后仅显示两个。有什么建议吗 这是my data.json: { "TileCollection": [{ "title": "Slovenská Republika",
tile
聚合绑定到本地JSON数据文件
数据文件包含一个包含三项的数组。但是,渲染后仅显示两个。有什么建议吗
这是my 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>
非常感谢您的建议 同时,我也用瓷砖容器解决了这个问题
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() {
//
// }
});
});
我所做的是,我没有使用默认模型。
我在component.js中初始化了模型
然后使用model>/TileCollection,虽然我仍然有点困惑,但它仍然有效。
不过,也感谢您的回答。Hmm,我不明白为什么它只显示当前代码中的两个分幅。浏览器控制台中是否有错误消息?更新页面时,您是否正在更新?
yourTileContainer.getBinding(“tiles”).getLength()返回什么?顺便说一句,从1.50版开始,除了sap.m.GenericFile
之外的所有tile都不推荐使用。作为旁注..控制台中没有错误,缓存没有被禁用。onInit或onBeforeRendering或OnAfterRendering中的yourTileContainer.getBinding(“tiles”).getLength()=0如果不推荐使用tileContainer,应使用什么替代?还有,你是从哪里得到这些信息的?我的意思是,最好禁用缓存,这样浏览器在更新时不会显示过时的数据。关于弃用:您可以在我在前面的评论中链接到的当前每晚版本的API引用中看到这一通知。上面写着“从1.50开始就被弃用了。替换为您选择的带有实例的容器”。很高兴您能解决这个问题。你也可以接受你自己的答案来告诉别人。但有点让人困惑的是什么?
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() {
//
// }
});
});