I got an error when initiating sap ui program, please help
manifest.json
"sap.ui5": {
"rootView": {
"viewName": "latihan1.view.App",
"type": "XML"
},
"dependencies": {
"minUI5Version": "1.30.0",
"libs": {
"sap.ui.core": {},
"sap.m": {},
"sap.f": {},
"sap.ui.layout": {}
}
},
"config": {
"fullWidth": true
},
"contentDensities": {
"compact": true,
"cozy": true
},
and index.html
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta charset="UTF-8">
<title>latihan1</title>
<script id="sap-ui-bootstrap"
src="../../resources/sap-ui-core.js"
data-sap-ui-libs="sap.ui.core, sap.m, sap.f, sap.ui.layout"
data-sap-ui-theme="sap_belize"
data-sap-ui-compatVersion="edge"
data-sap-ui-resourceroots='{"latihan1": ""}'>
</script>
and component.js
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/Device",
"latihan1/model/models",
"sap/f/library"
], function(UIComponent, Device, models, library) {
"use strict";
return UIComponent.extend("latihan1.Component", {
metadata: {
manifest: "json"
},
/**
* 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);
// enable routing
this.getRouter().initialize();
// set the device model
this.setModel(models.createDeviceModel(), "device");
}
});
The library already loaded
You can remove the sap/f/library inside the dependencies of your Component. Can you try that? Having them in the manifest inside the libs is enough. You don't even need those inside the index file as well.
However what seems be missing in your manifest.json file is the router class under sap.ui5 section.
"routing": {
"config": {
"routerClass": "sap.f.routing.Router"
}
Related
We upgraded our GW system to 7.52 SP 7 and also migrated the systems from on-prem to Azure. ECC 7 system is on-prem. After the upgrade and migration was done, the Standard Fiori app 'My Benefits' tile is opening but only the standard portion is working and the extended parts are throwing errors.
Here are the errors:
Errors in Console (Browser debugger)
XMLTemplateProcessor-dbg.js:98 Uncaught Error: found in negative cache: 'sap/m/columns.js' from ./resources/sap/m/columns.js: failed to load 'sap/m/columns.js' from ./resources/sap/m/columns.js: 404 - at makeNestedError (https://host:port/sap/bc/ui5_ui5/sap/zmybenefitsext/resources/sap-ui-core.js:92:37)
XHRInterceptor-dbg.js:58 GET https://host:port/sap/bc/ui5_ui5/sap/zmybenefitsext/resources/sap/m/columns.js 404
XMLTemplateProcessor-dbg.js:98 Uncaught Error: failed to load 'sap/m/columns.js' from ./resources/sap/m/columns.js: 404 - Not Found
Error in the Network tab (Browser debugger)
404(Not Found) for https://host:port/sap/bc/ui5_ui5/sap/zmybenefitsext/resources/sap/m/columns.js
I couldn't find any errors in the front-end or the back-end, I cleaned up the caches on both front-end and back-end and also re-indexed the app on the gateway. I also reactivated the ICF nodes.
Here's the index.html
<!DOCTYPE HTML>
<html>
<!-- IMPORTANT
This HTML file is meant for testing the application/component standalone, outside the Unified Shell.
Some integration functionality, personalization etc. will not be available when running standalone.
-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta charset="UTF-8">
<title>zMyBenefitsExtension</title>
<script id="sap-ui-bootstrap"
src="./resources/sap-ui-core.js"
data-sap-ui-libs="sap.m, sap.me"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-compatVersion="1.16"
data-sap-ui-resourceroots='{"hcm.mybenefits.zMyBenefitsExtension": "./"}'>
</script>
<!-- Application launch configuration -->
<script>
sap.ui.getCore().attachInitEvent(function () {
var oComponentContainer = new sap.ui.core.ComponentContainer({
height : "100%",
name:"hcm.mybenefits.zMyBenefitsExtension"
});
oComponentContainer.placeAt("content");
});
</script>
</head>
<!-- UI Content -->
<body class="sapUiBody" id="content" role="application">
</body>
</html>
Here's the source code for Component.js
jQuery.sap.declare("hcm.mybenefits.zMyBenefitsExtension.Component");
// use the load function for getting the optimized preload file if present
sap.ui.component.load({
name: "hcm.mybenefits",
url: jQuery.sap.getModulePath("hcm.mybenefits.zMyBenefitsExtension") + "/../HCM_BENF_MON" // provide parent project url
// we use a URL relative to our own component; might be different if
// extension app is deployed with customer namespace
});
hcm.mybenefits.Component.extend("hcm.mybenefits.zMyBenefitsExtension.Component", {
metadata: {
version : "1.0",
config : {
"sap.ca.i18Nconfigs": {
"bundleName":"hcm.mybenefits.zMyBenefitsExtension.i18n.i18n"
},
},
customizing: {
"sap.ui.controllerExtensions": {
"hcm.mybenefits.view.S7": {
controllerName: "hcm.mybenefits.zMyBenefitsExtension.view.S7Custom",
},
"hcm.mybenefits.view.S6": {
controllerName: "hcm.mybenefits.zMyBenefitsExtension.view.S6Custom",
},
"hcm.mybenefits.view.S5": {
controllerName: "hcm.mybenefits.zMyBenefitsExtension.view.S5Custom",
},
"hcm.mybenefits.view.S3": {
controllerName: "hcm.mybenefits.zMyBenefitsExtension.view.S3Custom",
},
"hcm.mybenefits.view.S4": {
controllerName: "hcm.mybenefits.zMyBenefitsExtension.view.S4Custom",
},
},
"sap.ui.viewExtensions": {
"hcm.mybenefits.view.S7": {
"extS7Header": {
className: "sap.ui.core.Fragment",
fragmentName: "hcm.mybenefits.zMyBenefitsExtension.view.extS7HeaderCustom",
type: "XML",
},
},
"hcm.mybenefits.view.S6": {
"extS6Header": {
className: "sap.ui.core.Fragment",
fragmentName: "hcm.mybenefits.zMyBenefitsExtension.view.extS6HeaderCustom",
type: "XML",
},
},
"hcm.mybenefits.view.S5": {
"extS5Header": {
className: "sap.ui.core.Fragment",
fragmentName: "hcm.mybenefits.zMyBenefitsExtension.view.extS5HeaderCustom",
type: "XML",
},
},
"hcm.mybenefits.view.S3": {
"extS3Header": {
className: "sap.ui.core.Fragment",
fragmentName: "hcm.mybenefits.zMyBenefitsExtension.view.extS3HeaderCustom",
type: "XML",
},
},
"hcm.mybenefits.view.S4": {
"extS4Header": {
className: "sap.ui.core.Fragment",
fragmentName: "hcm.mybenefits.zMyBenefitsExtension.view.extS4HeaderCustom",
type: "XML",
},
},
},
"sap.ui.viewModifications": {
"hcm.mybenefits.view.S7": {
"MB_PLAN_PERIOD": {
"visible": false
},
},
"hcm.mybenefits.view.S6": {
"MB_PLAN_PERIOD": {
"visible": false
},
},
"hcm.mybenefits.view.S5": {
"MB_PLAN_PERIOD": {
"visible": false
},
},
"hcm.mybenefits.view.S4": {
"MB_PLAN_PERIOD": {
"visible": false
},
},
"hcm.mybenefits.view.S3": {
"MB_PLAN_PERIOD": {
"visible": false
},
},
},
}
}
});
Here's the link to the same question in the official SAP forum with embedded screenshots for SICF node for the Standard Fiori app and the LPD_CUST config for the extension app.
https://answers.sap.com/questions/13230788/fiori-standard-app-my-benefits-extensions-not-work.html
I found the issue. The version of the standard Fiori app is using SAPUI5 1.28.5 where columns aggregation is still part of sap.m.List but deprecated. Also, the GW before the upgrade had the SAPUI5 version of 1.52 which still had columns listed as aggregation of List. That's why the app was working before but the upgraded GW SAPUI5 version is 1.71.24 where columns aggregation doesn't exist, hence the NOT FOUND error.
Because the XML is part of the standard code, I won't be able to modify the XML to replace columns with Table.
We had created a ticket with SAP and they said they will have to fix it for us.
I am new to SAPUI5. I am trying to load a JSON Model from Manifest file and send JSON object as a parameter through Routing and Navigation.
I have only one view and in that i am trying to bind data in a simple form. I am getting one error :
View1.controller.js?eval:8 Uncaught (in promise) TypeError: Cannot
read property ‘getModel’ of undefined
Kindly help me in resolving the error.
Manifest.json
{
"_version": "1.8.0",
"sap.app": {
"_version": "1.3.0",
"id": "com.newproject.firstsapui5project",
"type": "application",
"i18n": "i18n/i18n.properties",
"applicationVersion": {
"version": "1.0.0"
},
"title": "{{appTitle}}",
"description": "{{appDescription}}",
"sourceTemplate": {
"id": "ui5template.basicSAPUI5ApplicationProject",
"version": "1.40.12"
},
"dataSources": {
"data": {
"type" : "JSON",
"uri": "model/data.json"
}
}
},
"sap.ui": {
"_version": "1.3.0",
"technology": "UI5",
"icons": {
"icon": "",
"favIcon": "",
"phone": "",
"phone#2": "",
"tablet": "",
"tablet#2": ""
},
"deviceTypes": {
"desktop": true,
"tablet": true,
"phone": true
},
"supportedThemes": [
"sap_hcb",
"sap_belize"
]
},
"sap.ui5": {
"_version": "1.2.0",
"rootView": {
"viewName": "com.newproject.firstsapui5project.view.View1",
"type": "XML"
},
"dependencies": {
"minUI5Version": "1.60.1",
"libs": {
"sap.ui.layout": {},
"sap.ui.core": {},
"sap.m": {}
}
},
"contentDensities": {
"compact": true,
"cozy": true
},
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"settings": {
"bundleName": "com.newproject.firstsapui5project.i18n.i18n"
}
},
"simpleForm": {
"type": "sap.ui.model.json.JSONModel",
"dataSource" : "data"
}
},
"resources": {
"css": [{
"uri": "css/style.css"
}]
},
"routing": {
"config": {
"routerClass": "sap.m.routing.Router",
"viewType": "XML",
"async": true,
"viewPath": "com.newproject.firstsapui5project.view",
"controlAggregation": "pages",
"controlId": "idAppControl",
"clearControlAggregation": false
},
"routes": [{
"name": "RouteView1",
"pattern": "RouteView1",
"target": ["TargetView1"]
}],
"targets": {
"TargetView1": {
"viewType": "XML",
"transition": "slide",
"clearControlAggregation": false,
"viewName": "View1"
}
}
}
}
}
View1.controller.js
sap.ui.define([
"sap/ui/core/mvc/Controller"
], function (Controller) {
"use strict";
var oController= Controller.extend("com.newproject.firstsapui5project.controller.View1", {
onInit: function () {
var dataModel = this.getOwnerComponent().getModel("simpleForm");
this.getView().setModel(dataModel, "DataModel");
}
});
return oController;
});
Component.js
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/Device",
"com/newproject/firstsapui5project/model/models"
], function (UIComponent, Device, models) {
"use strict";
var Component = UIComponent.extend("com.newproject.firstsapui5project.Component", {
metadata: {
manifest: "json"
},
/**
* 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);
this.setModel(models.createDeviceModel(), "device");
this.getRouter().initialize();
}
});
return Component;
});
data.json
{"Form" : [{
"first":"tom",
"lastname":"butler",
"height": "6foot",
"gender":"Male"
}]
}
View1.view.xml
<mvc:View controllerName="com.newproject.firstsapui5project.controller.View1" xmlns:html="http://www.w3.org/1999/xhtml"
xmlns:mvc="sap.ui.core.mvc" xmlns:f="sap.ui.layout.form" displayBlock="true" xmlns="sap.m">
<App id="idAppControl">
<pages>
<Page title="My First sapui5 Project">
<content>
<f:SimpleForm id="idSimpleForm" editable="true" layout="ResponsiveGridLayout" title='TEST Form'>
<f:content>
<Label text="First Name"/>
<Input value="simpleForm>/Form/0/first" />
<Label text="Last Name"/>
<Input value="{simpleForm>/Form/0/lastname}">
</Input>
</f:content>
</f:SimpleForm>
</content>
</Page>
</pages>
</App>
</mvc:View>
model.js
sap.ui.define([
"sap/ui/model/json/JSONModel",
"sap/ui/Device"
], function (JSONModel, Device) {
"use strict";
return {
createDeviceModel: function () {
var oModel = new JSONModel(Device);
oModel.setDefaultBindingMode("OneWay");
return oModel;
}
};
});
index.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta charset="UTF-8">
<title>firstsapui5project</title>
<script id="sap-ui-bootstrap"
src="../../resources/sap-ui-core.js"
data-sap-ui-async="true"
data-sap-ui-libs="sap.m"
data-sap-ui-theme="sap_belize"
data-sap-ui-compatVersion="edge"
data-sap-ui-language="en"
data-sap-ui-xx-componentPreload="off"
data-sap-ui-resourceroots='{"com.newproject.firstsapui5project": ""}'>
</script>
<link rel="stylesheet" type="text/css" href="css/style.css">
<script>
sap.ui.getCore().attachInit(function() {
/* new sap.m.Shell({
app: new sap.ui.core.ComponentContainer({
height : "100%",
name : "com.newproject.firstsapui5project"
})
}).placeAt("content");*/
var app = new sap.m.App({initialPage:"idView1"});
var page1 = sap.ui.view({id:"idView1", viewName:"com.newproject.firstsapui5project.view.View1", type:sap.ui.core.mvc.ViewType.XML});
app.addPage(page1);
// app.addDetailPage(page2);
app.placeAt("content");
});
</script>
</head>
<body class="sapUiBody" id="content">
</body>
</html>
View1 is not being initialized by a Component, thus an owner can't be determined. Instead of explicitly creating a view and putting it into DOM (index.html), create a sap.m.Shell as it's done in commented code. Shell would create a component which would create a root view that's specified in manifest.json.
Can you help me solve this mystery? I got the walkthrough example in step 10 and adapted it so I can create a simple binding to an OData service.
Let me share the main files:
Component.js
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/model/json/JSONModel"
], function(UIComponent, JSONModel) {
"use strict";
return UIComponent.extend("BasicMessages.Component", {
metadata: {
manifest: "json"
},
init: function() {
// call the init function of the parent
UIComponent.prototype.init.apply(this, arguments);
// set data model
var oData = {
recipient: {
name: "World"
}
};
var oModel = new JSONModel(oData);
this.setModel(oModel, "json");
},
});
});
Manifest.json (hid the service URI, but it's properly configured)
{
"_version": "1.8.0",
"sap.app": {
"id": "BasicMessages",
"type": "application",
"i18n": "i18n/i18n.properties",
"title": "{{appTitle}}",
"description": "{{appDescription}}",
"applicationVersion": {
"version": "1.0.0"
},
"dataSources": {
"mainService": {
"uri": "hidden_service_uri",
"type": "OData",
"settings": {
"odataVersion": "2.0",
"localUri": "localService/metadata.xml"
}
}
}
},
"sap.ui": {
"technology": "UI5",
"deviceTypes": {
"desktop": true,
"tablet": true,
"phone": true
}
},
"sap.ui5": {
"rootView": {
"viewName": "BasicMessages.view.App",
"type": "XML",
"async": true,
"id": "app"
},
"dependencies": {
"minUI5Version": "1.30",
"libs": {
"sap.m": {}
}
},
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"settings": {
"bundleName": "BasicMessages.i18n.i18n"
}
},
"": {
"dataSource": "mainService",
"settings": {
"defaultUpdateMethod": "PUT",
"useBatch": false,
"metadataUrlParams": {
"sap-documentation": "heading"
},
"defaultBindingMode": "TwoWay"
}
}
}
}
}
App.controller.js
sap.ui.define([
"sap/ui/core/mvc/Controller",
"sap/m/MessageToast"
], function(Controller, MessageToast) {
"use strict";
return Controller.extend("BasicMessages.controller.App", {
onInit: function() {
this.getView().setModel(this.getOwnerComponent().getModel());
},
onShowHello: function() {
// read msg from i18n model
var oBundle = this.getView().getModel("i18n").getResourceBundle();
var sRecipient = this.getView().getModel("json").getProperty("/recipient/name");
var sMsg = oBundle.getText("helloMsg", [sRecipient]);
// show message
MessageToast.show(sMsg);
},
});
});
App.view.xml (this is the tricky file)
<mvc:View controllerName="BasicMessages.controller.App"
xmlns:mvc="sap.ui.core.mvc"
xmlns="sap.m">
<Button text="{i18n>showHelloButtonText}" press="onShowHello" />
<Input value="{json>/recipient/name}"
description="Hello {json>/recipient/name}"
valueLiveUpdate="true" width="60%"
/>
<Text text="{/Caixas(Id='0001',InicioValidade='20180712193002')/Descricao}" />
<List items="{/Caixas}">
<StandardListItem title="{Descricao}" />
</List>
</mvc:View>
If I use the view file exactly like that, it calls the OData service on the backend and retrieve the list and the text element contents.
link to screenshot:
If I comment the list lines, the OData service won't be called and the text element won't be filled with the text.
link to screenshot:
Why does this happen???
Got the answer on SAP Docs
Note: Requests to the back end are triggered by list bindings (ODataListBinding), element bindings (ODataContextBinding), and CRUD functions provided by the ODataModel. Property bindings (ODataPropertyBindings) do not trigger requests.
I think, Rafael explained why this happens (your question), now to answer the unasked question "howto make this work":
You would need to bind the Text control to the entitiy and the text property to the Descricio attribute, basically something like that:
<Text binding="{/Caixas(Id='0001',InicioValidade='20180712193002')" text="{Descricao}" />
(sorry, no ui5 runtime environment at hand, so I didnt actually run this)
I am working on variant management using shell. I got 'getService' of undefined error in FLP. After adding below libraries, It worked.
Index.html
<script>
window["sap-ushell-config"] = {
defaultRenderer : "fiori2",
renderers: {
fiori2: {
componentData: {
config: {
search: "hidden"
}
}
}
},
applications: {
"OrderTracking-display": {
additionalInformation: "SAPUI5.Component=orders",
applicationType: "URL",
url: ".",
title: "Order Tracking"
}
}
};
</script>
<script src="/sap/public/bc/ui5_ui5/resources/sap/ushell_abap/bootstrap/abap.js" id="sap-ushell-bootstrap"></script>
<script id="sap-ui-bootstrap"
src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
data-sap-ui-libs="sap.ushell, sap.collaboration, sap.m, sap.ui.commons,
sap.ui.layout, sap.ui.ux3"
data-sap-ui-theme="sap_belize"
data-sap-ui-bindingSyntax="complex"
data-sap-ui-compatVersion="edge"
data-sap-ui-resourceroots='{"orders": "."}'
data-sap-ui-frameOptions="trusted">
manifest.json
"sap.ui5": {
"rootView": {
"viewName": "orders.view.App",
"type": "XML",
"async": true,
"id": "app"
},
"dependencies": {
"minUI5Version": "1.42.0",
"libs": {
"sap.ui.core": {},
"sap.m": {},
"sap.f": {},
"sap.ushell": {},
"sap.collaboration": {
"lazy": true
}
}
},
"contentDensities": {
"compact": true,
"cozy": true
},
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"settings": {
"bundleName": "orders.i18n.i18n"
}
},
"": {
"dataSource": "mainService",
"preload": true
}
},
"services": {
"ShellUIService": {
"factoryName": "sap.ushell.ui5service.ShellUIService",
"lazy": false,
"settings": {
"setHierarchy": "auto",
"setTitle": "auto"
}
}
},
But I couldn't find ui5service.ShellUIService under sap.ushell. Also popups & date pickers is not working. How to make both sap.ushell.ui5service &
sap.ushell.services libraries work.
Below are the errors I get
Error -1
Error -2
There is no 'ui5service' under 'ushell'
sap.ushell
The index.html file is used to run an app from the WebIDE in test mode during development. A local launchpad called a Sandbox is created to run the app but not all services from launchpad (cloud or abap) are available.
The libraries that the app needs must be defined in the javascript files where they are needed.
How can I configure manifest.json file so when I run mockserver(mockserver.html) then it goes to the local json data and when I run index.html (main entry to application) then it goes to the remote service. I have a sample manifest.json file from the documentation but not very clear how remote and local service come into play.
{
"_version": "1.1.0",
"sap.app": {
"_version": "1.1.0",
"id": "xxx",
"type": "application",
"title": "{{appTitle}}",
"description": "{{appDescription}}",
"applicationVersion": {
"version": "1.0.0"
},
"dataSources": {
"mainService": {
"uri": "https://services.odata.org/V2/Northwind/Northwind.svc/",
"type": "OData",
"settings": {
"odataVersion": "2.0",
"localUri": "localService/metadata.xml"
}
}
}
},
"sap.ui": {
"_version": "1.1.0",
"technology": "UI5",
"icons": {
"icon": "",
"favIcon": "",
"phone": "",
"phone#2": "",
"tablet": "",
"tablet#2": ""
},
"deviceTypes": {
"desktop": true,
"tablet": true,
"phone": true
},
"supportedThemes": [
"sap_hcb",
"sap_bluecrystal"
]
},
"sap.ui5": {
"_version": "1.1.0",
"rootView": {
"viewName": "xxx.view.Main",
"type": "XML"
},
"dependencies": {
"minUI5Version": "1.30.0",
"libs": {
"sap.ui.core": {},
"sap.m": {},
"sap.ui.layout": {}
}
},
"contentDensities": {
"compact": true,
"cozy": true
},
"config": {
"productLocal": "localService/mockdata/products.json",
"productRemote": "/some remote end point"
},
"products": {
"dataSource": "mainService"
}
}
}
Controller code
var oModel = new sap.ui.model.odata.ODataModel("/", true);
//var data = oModel;
//console.log(data);
var inputModel = new JSONModel("../model/inputs.json");
var productsModel = new JSONModel();
oModel.read("/ProductSet",
null,
null,
false,
function _OnSuccess(oData, response) {
console.log(oData);
console.log(response);
var data = {"ProductCollection" : oData.results};
productsModel.setData(data);
},
function _OnError(error) {
console.log(error);
});
//set model(s) to current xml view
this.getView().setModel(inputModel, "inputModel");
this.getView().setModel(productsModel);
Thanks for the help.
You don't need to touch manifest.json file for mocking the service.
In fact, in manifest.json the property of dataSources- localUri: takes relative URL to local metadata document or annotation uri. Not for the service.
I hope your mockserver.html looks like this:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<title>MockServerTutorial</title>
<script id="sap-ui-bootstrap"
src="../../resources/sap-ui-core.js"
data-sap-ui-libs="sap.m"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-resourceroots='{"sap.ui.demo.MockServer": "../"}'>
</script>
<link rel="stylesheet" type="text/css" href="../css/style.css">
<script>
sap.ui.getCore().attachInit(function() {
sap.ui.require([
"sap/ui/demo/MockServer/localService/mockserver",
"sap/m/Shell",
"sap/ui/core/ComponentContainer"
], function (mockserver, Shell, ComponentContainer) {
mockserver.init();
new Shell({
app: new sap.ui.core.ComponentContainer({
height : "100%",
name : "MockServerTutorial"
})
}).placeAt("content");
});
});
</script>
</head>
<body class="sapUiBody" id="content">
</body>
</html>
You can define your mock server as below:
sap.ui.define([
"sap/ui/core/util/MockServer"
], function(MockServer) {
"use strict";
return {
/**
* Initializes the mock server.
* You can configure the delay with the URL parameter "serverDelay".
* The local mock data in this folder is returned instead of the real data for testing.
* #public
*/
init: function() {
// create
var oMockServer = new MockServer({
rootUri: "/"
});
// simulate against the metadata and mock data
oMockServer.simulate("../localService/metadata.xml", {
sMockdataBaseUrl: "../localService/mockdata",
bGenerateMissingMockData: true
});
// start
oMockServer.start();
jQuery.sap.log.info("Running the app with mock data");
}
};
});
Please make sure you will handle custom urls (with filters/sorts) and
function import properly in mockserver.js.
Read complete steps here