zoukankan      html  css  js  c++  java
  • UI5 Databind

    总共有三种类型的Data Bind:
    1. Property Binding:
        属性的绑定共有三种绑定方法:

            var oTextField = new sap.ui.commons.TextField({value: "{/company/name}"});
            oTextField.bindProperty("value", "/company/name");
            oTextField.bindValue("/company/name");

        格式化结果:
           

       oTextField.bindProperty("value", "/company/title", function(sValue) {
                                        return sValue && sValue.toUpperCase();
                                    });
            oControl = new sap.ui.commons.TextField({
                            value: {
                                path:"/company/revenue",
                                formatter: function(fValue) {
                                    if (fValue) {
                                        return "> " + Math.floor(fValue/1000000) + "M";
                                    }
                                    return "0";
                                }
                            }
                        });                    

    2. Aggregation Binding:

            var data = [{
                    rowInfo:[
                            {
                            chartInfo: [
                                {title: oBundle.getText('Home_DashBoardCahrt_map'), path: 'css/images/chart_map.png'},
                               ]
                            }, {
                               chartInfo: [
                                {title: oBundle.getText('Home_DashBoardCahrt_dso'), path: 'css/images/chart_dso.png'},
                               ]
                            }, {
                               chartInfo: [
                                {title: oBundle.getText('Home_DashBoardCahrt_risk'), path: 'css/images/chart_risk.png'},
                               ]
                            }, {
                               chartInfo: [
                                {title: oBundle.getText('Home_DashBoardCahrt_credit'), path: 'css/images/chart_credit.png'},
                               ]
                            },
                    ]}];
                oModel = new sap.ui.model.json.JSONModel(),
                oContentTemplate = new sap.ui.commons.layout.VerticalLayout({
                                "99%",
                               content:[
                                   new sap.ui.commons.Image({src:'{path}',"100%",height:"100px"}),
                                   new sap.ui.commons.CheckBox({text:'{title}'}),
                               ],
                           }),
                cellTemplate = new sap.ui.commons.layout.MatrixLayoutCell(),
                oRowTemplate = new sap.ui.commons.layout.MatrixLayoutRow(),
                oMatrixLayout = new sap.ui.commons.layout.MatrixLayout();
                    
            oModel.setData(data);
            oMatrixLayout.setModel(oModel);
            cellTemplate.bindAggregation('content', 'chartInfo', oContentTemplate);
            oRowTemplate.bindAggregation('cells', 'rowInfo', cellTemplate);
            oMatrixLayout.bindAggregation('rows', '/', oRowTemplate);

            [总结: 只要是bindAggregation,则path下面的是一个数组, 在最后的绑定上面才是一个对像]
    3. Element Binding:

        var data = {clients:[
                          {firstName:"Donald", lastName:"Duck"},
                             items: [ {name: "iPhone"}, {name:"iPad"} ]
                          }
               ]};
            oLB = sap.ui.commons.ListBox("myLb", {height:"100px"}),
            oItemTemplate = new sap.ui.core.ListItem();
            
        oItemTemplate.bindProperty("text", "name");
        oLB.bindAggregation("items", "items", oItemTemplate);
        oLB.bindElement("/clients/0");
  • 相关阅读:
    CAS实战の自定义注销
    CAS实战の自定义登录
    MongoDB学习总结
    Django登录使用的技术和组件
    Docker搭建Hadoop环境
    配置Nginx的坑及思路
    Centos7 升级 sqlite3
    Python基础题
    pandas的数据筛选之isin和str.contains函数
    CentOS7 下Docker最新入门教程 超级详细 (安装以及简单的使用)
  • 原文地址:https://www.cnblogs.com/lindsayzhao103011/p/2877186.html
Copyright © 2011-2022 走看看