具有 json 数据绑定的 sap ui5

Question

如果我有json这样的数据

[{"processor":"Mr. XYZ","components":["asd","efg","ghi","fjk"]} ,
{"processor":"Mr. XYZ","components":["asd","efg","ghi","ghi"]} ,
{"processor":"Mr. XYZ","components":["asd","efg","lkl"]} ]

如果我将其绑定到 table:

<Table id="myt1" items="{path: '/'}"> 
    <columns>
        <Column> 
            <Label text="Processor"/> 
        </Column>
        <Column> 
            <Label text="Components"/> 
        </Column>
    </columns>
    <items>
        <ColumnListItem>
            <Text text="{processor}"/>
            <Text text="{components}"/>
        </ColumnListItem>
    </items>
</Table>

如何在 table 中的处理器的单元格中将组件数组绑定到单独的行中？请参考图像以获取我正在寻找的输出。

提前致谢！

Answer 1

您可以使用文本格式化程序在每个数组元素后添加一个新行。

<ColumnListItem>
                <Text text="{processor}"/>
                <Text text="{
                    path: 'components',
                    formatter: '.formatter.formatText'
                }"/>
</ColumnListItem>

格式化程序：

sap.ui.define([], function () {
"use strict";
return {

    formatText : function(s){
        var sOut = "";
        s.forEach(function(sTxt){
            sOut += sTxt + "\n";
        });
        return sOut;
    }
 }
});

具有 json 数据绑定的 sap ui5

sap ui5 with json data binding

jsonmodel

sapui5