Hello Experts,
I'm new SAP UI5 , i'm developing App by following project structure ,please help me to i18n model is loading in manifest.json file ,it's urgent
index.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<title>SAP UI5</title>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-compatVersion="edge"
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-resourceroots='{"sap.myApp" : "./", "i18n" : "./i18n" }'>
</script>
<!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->
<script>
sap.ui.getCore().attachInit(function()
{
new sap.m.Shell(
{
app:new sap.ui.core.ComponentContainer(
{
height:"100%",
name:"sap.myApp"
})
}).placeAt("content");
});
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
Component.js
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/Device",
//"HelloWorld/model/models"
//"sap/myApp/model/models"
], function(UIComponent, Device, models) {
"use strict";
return UIComponent.extend("sap.myApp.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);
var oModel = new sap.ui.model.json.JSONModel("model/car.json");
this.setModel(oModel);
// set the device model
//this.setModel(models.createDeviceModel(), "device");
}
});
});
manifest.json
{
"_version": "1.5.0",
"sap.app": {
"id": "sap.myApp",
"type": "application",
"i18n": "i18n/i18n.properties",
"applicationVersion": {
"version": "1.0.0"
},
"title": "{{appTitle}}",
"description": "{{appDescription}}",
"sourceTemplate": {
"id": "ui5template.basicSAPUI5ApplicationProject",
"version": "1.40.12"
}
},
"sap.ui": {
"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": {
"rootView": {
"viewName": "sap.myApp.view.App",
"type": "XML"
},
"dependencies": {
"minUI5Version": "1.30.0",
"libs": {
"sap.ui.core": {},
"sap.m": {},
"sap.ui.layout": {},
"sap.ushell": {},
"sap.collaboration": {},
"sap.ui.comp": {},
"sap.uxap": {}
}
},
"contentDensities": {
"compact": true,
"cozy": true
},
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"settings": {
"bundleName": "sap.myApp.i18n/i18n"
}
}
},
"resources": {
"css": [{
"uri": "css/style.css"
}]
}
}
}
App.view.xml
<core:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m"
controllerName="sap.myApp.controller.App" xmlns:html="http://www.w3.org/1999/xhtml">
<Image src="https://upload.wikimedia.org/wikipedia/commons/9/9f/Pigeony.jpg"/>
<Input value="{/car/carModel}"
description="Hello {/car/carModel}"
valueLiveUpdate="true"
width="40%"/>
<Button type="{i18n>Click}" press="onClick"></Button>
</core:View>
i18n.properties
Click = click me
9 Answers
-
Mar 27, 2017 at 09:47 AM
Hello
May I ask why you are binding the button "type" to the value "click me"? Shouldn't it be "text"?
i.e:
<Button text="{i18n>Click}" press="onClick"></Button>Regards
Antonette
Add comment
-
Mar 27, 2017 at 10:39 AM
Try fixing your bundle name of the i18n model in your manifest, remove the "/". (see below)
Regards
Antonette
"i18n": {"type": "sap.ui.model.resource.ResourceModel","settings": {"bundleName": "sap.myApp.i18n.i18n"}}Add comment
-
Mar 27, 2017 at 11:48 AM
Is your app initializing? do you get any errors?
Antonette
Add comment
-
Mar 27, 2017 at 12:39 PM
Use the below code...
Manifest.json
{ "_version": "1.5.0", "sap.app": { "id": "sap.myAppsap.myApp", "type": "application", "i18n": "i18n/i18n.properties", "applicationVersion": { "version": "1.0.0" }, "title": "{{appTitle}}", "description": "{{appDescription}}", "sourceTemplate": { "id": "ui5template.basicSAPUI5ApplicationProject", "version": "1.40.12" } }, "sap.ui": { "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": { "rootView": { "viewName": "sap.myAppsap.myApp.view.View1", "type": "XML" }, "dependencies": { "minUI5Version": "1.30.0", "libs": { "sap.ui.core": {}, "sap.m": {}, "sap.ui.layout": {}, "sap.ushell": {}, "sap.collaboration": {}, "sap.ui.comp": {}, "sap.uxap": {} } }, "contentDensities": { "compact": true, "cozy": true }, "models": { "i18n": { "type": "sap.ui.model.resource.ResourceModel", "settings": { "bundleName": "sap.myAppsap.myApp.i18n.i18n" } } }, "resources": { "css": [{ "uri": "css/style.css" }] } } } Component.js sap.ui.define([ "sap/ui/core/UIComponent", "sap/ui/Device", "sap/myAppsap/myApp/model/models" ], function(UIComponent, Device, models) { "use strict"; return UIComponent.extend("sap.myAppsap.myApp.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); // set the device model this.setModel(models.createDeviceModel(), "device"); } }); }); Index: <!DOCTYPE HTML> <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta charset="UTF-8"> <title>sap.myApp</title> <script id="sap-ui-bootstrap" src="../../resources/sap-ui-core.js" data-sap-ui-libs="sap.m" data-sap-ui-theme="sap_belize" data-sap-ui-compatVersion="edge" data-sap-ui-resourceroots='{"sap.myAppsap.myApp": ""}'> </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 : "sap.myAppsap.myApp" }) }).placeAt("content"); }); </script> </head> <body class="sapUiBody" id="content"> </body> </html>Add comment
-
Mar 27, 2017 at 12:22 PM
Can you please post a screenshot of your console for the initialization of the app
Antonette
Add comment
-
Mar 27, 2017 at 12:31 PM
Try removing the i18n from your bootstrap:
data-sap-ui-resourceroots='{"sap.myApp" : "./"}'>Add comment
Add comment