Hi ,
I am facing the below error:
"UIComponent.js:6 Uncaught TypeError: Cannot read property 'rootControl' of undefined"
please help me to resolve this issue, find below my coding snippet.
thanks in advance...
1. 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'/>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m"
data-sap-ui-resourceroots='{
"shoppingcart1":"./shoppingcart1",
"sap.demo.cart":"./"
}'
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->
<script>
jQuery.sap.require("sap.demo.cart.common");
new sap.m.Shell("shell",{
app:new sap.ui.core.ComponentContainer({
name:"sap.demo.cart"
})
}).placeAt("content")
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
2. Component.js
jQuery.sap.declare("sap.demo.cart.Component");
sap.ui.core.UIComponent.extend("sap.demo.cart.Component",{
metadata:{
routing:{
config:{
viewType : "JS",
viewPath : "shoppingcart1",
targetControl : "SplitAppID",
clearTarget : false,
transition : "slide"
},
routes : [
]
}
},
init:function(){
jQuery.sap.require("sap.m.routing.RouteMatchedHandler");
jQuery.sap.require("sap.ui.core.routing.HashChanger");
sap.ui.core.UIComponent.prototype.init(this);
this._router = this.getRouter();
this._routeHandler = new sap.m.routing.RouteMatchedHandler(this._router);
this._router.initialize();
},
createContent:function(){
var oView = sap.ui.view({
id :"app",
viewName :"shoppingcart1.App",
type: "JS",
viewData : {component:this}
});
var oModel= new sap.ui.core.json.JSONModel("/model/products.json");
oView.setModel(oModel,"produts");
var data = {
items:[
]
};
var oCartModel= new sap.ui.core.json.JSONModel(data);
oView.setModel(oCartModel,"cart");
return oView;
}
});
3. App.view.js
sap.ui.jsview("shoppingcart1.App", {
/** Specifies the Controller belonging to this View.
* In the case that it is not implemented, or that "null" is returned, this View does not have a Controller.
* @memberOf shoppingcart1.App
*/
getControllerName : function() {
return "shoppingcart1.App";
},
/** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed.
* Since the Controller is given to this method, its event handlers can be attached right away.
* @memberOf shoppingcart1.App
*/
createContent : function(oController) {
this.setDisplayBlock(true);
return new sap.m.SplitApp("SplitAppID", {});
}
});
4. common.js
jQuery.sap.declare("sap.demo.cart.common");
sap.demo.cart.common = {
method1 : function(){
alert("method1 called");
}
};