user3905218
user3905218

Reputation: 79

UI5 Component Concept issue

I'm trying to use the component concept for UI5 and have just built the below:

Index.html snippet:

<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-resourceroots='{
                "sap.ui.ui5test.myapp": "./"
            }'>
        </script>
        <!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->

        <script>
        new sap.m.Shell({
            app : new sap.ui.core.ComponentContainer({
                name : "sap.ui.ui5test.myapp"
            })
        }).placeAt("content");

        </script>

Component.js snippet:

jQuery.sap.declare("sap.ui.ui5test.myapp.Component");

sap.ui.core.UIComponent.extend("sap.ui.ui5test.myapp.Component", {

        createContent : function() {
            var oView = new sap.ui.core.mvc.View({
                id : "testview",
                name : "sap.ui.ui5test.myapp.views.FirstView",
                type : "JS",
                viewData : {component : this}
            });

            var jsonModel = new sap.ui.model.json.JSONModel();
            jsonModel.loadData('http://api.openweathermap.org/data/2.5/weather?q=Auckland');
            //jsonModel.loadData('http://api.openweathermap.org/data/2.5/group?id=524901,703448,2643743&units=metric');
            sap.ui.getCore().setModel(jsonModel);

            oView.setModel(jsonModel);


        }

});

In the above snippet for component.js, if I return the view as return oView; it is giving me an error saying "Uncaught TypeError: undefined is not a function". It goes away as soon as I remove the return statement.

If I dont return the view will it navigate to the view I instantiated and loaded above? As I see in the chrome developer tools, I do not seem to find the js file for FirstView to open it as I think it is not getting loaded.

Please suggest how to correct this and how to navigate further.

Awaiting your prompt responses eagerly.

Cheers, AW

Upvotes: 1

Views: 8473

Answers (1)

Haojie
Haojie

Reputation: 5713

  1. I checked your FirstView.js. Please do the following in your return statement:

    return this.app;

    As there is no local variable called app, if you write return app, then app is undefined.

  2. Please use sap.ui.view in your createContent method:

         var oView = new sap.ui.view({
            id : "testview",
            viewName : "sap.ui.ui5test.myapp.views.FirstView",
            type : "JS",
            viewData : {component : this}
        });
    

Upvotes: 1

Related Questions