Bind Element to controls SAPUI5

Question

I'm trying to show some data retrieved by Odata Model on a XML View. In Component.js, I create a model with service Url and it works as usual.

    var oDataModel = new sap.ui.model.odata.v2.ODataModel("http://server:port/sap/opu/odata/SAP/ZWYMB_SRV", {
            user:"abapleader",
            password: "TH123456789a@",
            headers: {
                "sap-client": 300
            },
            useBatch:false
        });          
        this.setModel(oDataModel, "oDataModel");

So far, I've managed to get data to master using model.read() function.

Now I need to show the detail view. My code for onInit event is below:

            this.router.getRoute("zwm01detail").attachPatternMatched(this._onObjectMatched.bind(this));

        },
        _onObjectMatched: function(oEvent) {
            var that = this;
        var MaWorkDoc = oEvent.getParameter("arguments").MaWorkDoc;
            this.getModel("oDataModel").metadataLoaded().then(function() {
                var sPath = that.getModel("oDataModel").createKey("/WorkDocList", {
                    MaWorkDoc: MaWorkDoc,
                    Pernr: "0001"
                });
                console.log(sPath);
                that.getView().bindElement({
                    path:sPath
                });
            });

The sPath as I printed out using console.log(sPath) : /WorkDocList(MaWorkDoc='1110000001',Pernr='0001'), which I think, is correct. I also implemented and tested the back-end using this path and basically things are fine. But I don't know why I cannot show data on the view.

Detail.view.xml:

<Text text="{/MaWorkDoc}" maxLines="0"/>

Any suggestions, please?

Answer 1

Because you have given your model a name you will need to use that name in the binding. i.e. <Text text="{oDataModel>/MaWorkDoc}" maxLines="0"/>

Answer 2

So I've been working around with the docs and figure out there is model parameter which helps.

To be more specific, I add declare model in view.bindElement as below:

that.getView().bindElement({
                    path:sPath,
//** oDataModel = name of the model
                    model: "oDataModel"
                });

If there is any better solution, I'd very glad to know it. Thank you.!

Answer 3

I do not think the detail binding code should be inside the .metadataLoaded handler. Rather it should be directly inside _onObjectMatched.

I mean like this.

 _onObjectMatched: function(oEvent) {
        var that = this;
        var MaWorkDoc = oEvent.getParameter("arguments").MaWorkDoc;
        var sPath = that.getModel("oDataModel").createKey("/WorkDocList", {
                MaWorkDoc: MaWorkDoc,
                Pernr: "0001"
            });
            console.log(sPath);
            that.getView().bindElement({
                path:sPath
            });
        }