绑定在javascript模型中不起作用



我创建了javascript视图

 sap.ui.jsview("view.taskListView", {
/** 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 view.taskListView
*/ 
getControllerName : function() {
    return "view.taskListView";
},
/** 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 view.taskListView
*/ 
createContent : function(oController) {
    var oLabel = new sap.m.Label("l1",{ text :"Weekly Tasks", textAlign:"Center", width:"100%"}); 
  //  var oList = new sap.m.List({noDataText:"No data", items:"{/modelData}"});

   var oList=  new sap.m.List({    // define List Control
     //   mode: "MultiSelect",    // multi selection mode
    columns : [
        new sap.m.Column({  // first column
    }), 
    new sap.m.Column({  // second column
    })
], 
items : [
    new sap.m.ColumnListItem({  // first row
        type : "Navigation",
        //selected : true,    // first item is selected (from ListItemBase)
        cells : [
            new sap.ui.core.Icon({
                src : "{/iconTaskSource}",
                size : "1.5em"
            }),
            new sap.m.Text({       // second cell related to second column definition
                text : "{/taskName}"  
            })
        ]
    }),
    new sap.m.ColumnListItem({  // second row
       type : "Navigation",
        cells : [
            new sap.ui.core.Icon({
                src : "{/iconTaskSource}",
                size : "1.5em"
            }),
            new sap.m.Text({       // second cell related to second column definition
                text : "{/taskName}"
            })
        ]
    })  
]
  });

    return new sap.m.Page({
        title: "Title",
        content: [
            oLabel , oList
            /*
            new sap.m.Button({
               text:"Go to Page2",
               tap: function(){
                    //app.to("abc.SecondPage");
                    alert("Hello");
               }                   
          })
          */
        ]
    });
}

});

和控制器

   sap.ui.controller("view.weeklyTasks", {
onInit: function() {

   var aData2 = { modelData : [ 
      {iconTaskSource:"icon1", taskName: "task1"},
      {iconTaskSource:"icon2", taskName: "task2"}

    ]};

  var oModel = new sap.ui.model.json.JSONModel(aData2);
  this.getView().setModel(oModel2);
}

});

绑定不起作用我错过什么了吗?

尝试运行此代码片段。

sap.ui.jsview("view.taskListView", {
            getControllerName: function() {
                return "view.taskListView";
            },
            createContent: function(oController) {
                var oLabel = new sap.m.Label("l1", {
                    text: "Weekly Tasks",
                    textAlign: "Center",
                    width: "100%"
                });
                var oList = new sap.m.List({ // define List Control
                    columns: [
                        new sap.m.Column({ // first column
                        })
                    ]
                });
                var oTemplate = new sap.m.ColumnListItem({
                    type: "Navigation",
                    cells: [
                        new sap.m.Text({
                            text: "{taskName}"
                        })
                    ]
                });
                oList.bindItems('/modelData', oTemplate);
                return new sap.m.Page({
                    title: "Title",
                    content: [
                        oLabel, oList
                    ]
                });
            }
        });
        sap.ui.controller("view.taskListView", {
            onInit: function() {
                var aData2 = {
                    modelData: [
                        {
                            iconTaskSource: "icon1",
                            taskName: "task1"
                        }, {
                            iconTaskSource: "icon2",
                            taskName: "task2"
                        }
                    ]
                };
                var oModel = new sap.ui.model.json.JSONModel(aData2);
                this.getView().setModel(oModel);
            }
        });
        var oApp = new sap.m.App();
        var myView = sap.ui.view({
            type: sap.ui.core.mvc.ViewType.JS,
            viewName: "view.taskListView"
        });
        oApp.addPage(myView);
        oApp.placeAt('content');
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv='X-UA-Compatible' content='IE=edge' />
    <title>test</title>
    <script id='sap-ui-bootstrap' type='text/javascript' src='https://openui5.hana.ondemand.com/resources/sap-ui-core.js' data-sap-ui-theme='sap_bluecrystal' data-sap-ui-libs='sap.m'></script>
</head>
<body class='sapUiBody'>
    <div id='content'></div>
</body>
</html>

检查此项以获取代码的固定版本http://jsbin.com/kequme/1/edit

您需要在index.html文件中包含数据sap ui xx bindingSyntax="complex"。外观:

<script src="resources/sap-ui-core.js" id="sap-ui-bootstrap"
data-sap-ui-xx-bindingSyntax="complex" data-sap-ui-libs="sap.m"
data-sap-ui-theme="sap_bluecrystal">
    </script>

最新更新