Hi experts,
getting crazy over here just trying to implement a function to change views. When I try to change the view, the error message "Cannot read property 'to' of undefined" appears.
I guess there are some errors in the function in menu.controller? Can anyone see what it might be?
Thanks in advance!
Br
Max
Here's the code:
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-theme="sap_bluecrystal">
</script>
<!-- only load the mobile lib "sap.m" and the "sap_mvi" theme -->
<script type="text/javascript" src = "app.js"></script>
</head>
<body class="sapUiBody" id="root">
</body>
</html>
app.js:
sap.ui.localResources("view");
sap.ui.localResources("model");
sap.ui.localResources("app");
jQuery.sap.require("app.Component");
new sap.ui.core.ComponentContainer({
name: "app"
}).placeAt('root');
component.js:
jQuery.sap.declare("app.Component");
jQuery.sap.require("sap.ui.model.resource.ResourceModel");
sap.ui.core.UIComponent.extend("app.Component", {
createContent : function() {
// create root view
var oView = sap.ui.jsview("App", "view.App");
var i18nModel = new sap.ui.model.resource.ResourceModel({
bundleUrl: "i18n/i18n.properties"
});
oView.setModel(i18nModel, "i18n");
return oView;
}
});
app.view:
sap.ui.jsview("view.App", {
getControllerName : function() {
return "view.App";
},
createContent : function(oController) {
this.setDisplayBlock(true);
this.app = new sap.m.App();
var menu = sap.ui.jsview("Menu", "view.Menu");
menu.getController().nav = this.getController();
this.app.addPage(menu, true);
var info = sap.ui.jsview("Info", "view.Info");
info.getController().nav = this.getController();
this.app.addPage(info, false);
return new sap.m.Shell("Shell", {
title : "Titel",
showLogout: false,
app: this.app
});
}
});
app.controller:
sap.ui.controller("view.App", {});
menu.view:
sap.ui.jsview("view.Menu", {
getControllerName : function() {
return "view.Menu";
},
createContent : function(oController) {
var testTile = new sap.m.StandardTile({
press : this.getController().tilePress
});
return new sap.m.Page({
title: "Menu",
content: [
testTile
] });
} });
menu.controller:
sap.ui.controller("view.Menu", {
tilePress : function(evt) {
var context = evt.getSource().getBindingContext();
this.nav.to("Info", context);
}});
Project overview: