将数组数组映射到sap.m.Table控件

时间:2016-11-25 12:23:31

标签: javascript arrays sapui5

我的数据如下:

{
    meta: {
              format: "csv",
              info: "desc",
              columns: [
              {
                  id: "Name",
                  type: "Text",
                  length: 32          
              }, 
              {
                  id: "Text",
                  type: "Text",
                  length: 128
              }]
          },
    rows: [
              ["John","xxxx"],
              ["Alpha","yyyy"],
              ["Beta","wwww"],
              ["Gamma","zzzz"]]
}

现在,我正在努力将记录映射到sap.m.Table控件ColumnsRows。列似乎是直截了当,直接映射,但行是数组结构的数组。有没有办法绑定这个不是对象数组的结构?

1 个答案:

答案 0 :(得分:2)

显然,如果使用数组索引而不是属性名,则可以创建属性绑定。

<List id="list" items="{/rows}>
   <columns>
       <Column>
           <Label text="{/meta/columns/0/id}"/>
       </Column>
       <Column>
           <Label text="{/meta/columns/1/id}"/>
       </Column>
   </columns>
   <items>
       <ColumnListItem>
           <cells>
               <Text text="{0}"/>
               <Text text="{1}"/>
            </cells>
        </ColumnListItem>   
   </items>
</List>

动态地,您可以在控制器中执行以下绑定。它应该很容易适应您的用例:

var list = this.byId("list");

list.bindAggregation("columns", {
    "path" : "/meta/columns",
    "template" : new sap.m.Column({ 
        "header" : new sap.m.Label({ 
            "text" : "{name}" 
        })
    })
});

list.bindAggregation("items", {
    "path" : "/rows",
    "template" : new sap.m.ColumnListItem({
        "cells" : [
            new sap.m.Text({ "text" : "{0}" }), 
            new sap.m.Text({ "text" : "{1}" })
        ]})
});

列表不得包含任何绑定信息。

<List id="list"/>

如果您需要更多控制绑定过程,可以使用工厂函数而不是模板。

list.bindAggregation("columns", {
    "path" : "/meta/columns",
    "factory" : function(id, context) {
        return new sap.m.Column({ 
            "header" : new sap.m.Label({ 
                "text" : "{name}" 
            })
        });
     }
});