UI5 - 计算sap.m.table

时间:2018-01-05 16:35:49

标签: sapui5 xmltable

我有一个用SAP Web IDE创建的UI5表。

我希望表有2列。 第一个应显示从ODATA服务中提取的不同值,第二个应显示我的值的计数。

例如:

价值/计数

100/1

200/3

010/25

到目前为止,我已使用SAP的值创建了表格。 但它们并不是唯一的 - 第一列显示了每一个价值。

值 100

200

200

200

等等。

如何对所有值进行分组并显示相应的值计数?

这是我的代码:

Page.view.xml

                    <Table id="Table" items="{/ODATASet}">
                        <headerToolbar>
                            <Toolbar>
                                <Title level="H2" text="Data"></Title>
                                <ToolbarSpacer></ToolbarSpacer>
                                <Button icon="sap-icon://refresh" tooltip="Reinitialize Model" press="onModelRefresh"/>
                            </Toolbar>
                        </headerToolbar>
                        <columns>
                            <Column>
                                <Label text="Values"></Label>
                            </Column>
                            <Column>
                                <Label text="Count"></Label>
                            </Column>
                        </columns>
                        <items>
                            <ColumnListItem>
                                <cells>
                                    <Text text="{INTST}"></Text>
                                </cells>
                            </ColumnListItem>
                        </items>
                    </Table>

Page.controller.js:

        //Accessing the table from the fragment by it's Id  
        var oTable = this.byId("Table");

        //column list item creation
        var oTemplate = new sap.m.ColumnListItem({
            cells: [new sap.m.Text({
                text: "{INTST}"
            })]
        });
        var sServiceUrl = "/sap/opu/odata/sap/ODATAService";
        //Adding service to the odata model
        var oModel = new sap.ui.model.odata.ODataModel(sServiceUrl, false);
        //Setting model to the table
        oTable.setModel(oModel);
        oTable.bindAggregation("items", {
            path: "/ODATASet",
            template: oTemplate
        });
    },

1 个答案:

答案 0 :(得分:0)

通过lodash:

        $
            .ajax({
                url: '/sap/opu/odata/sap/ODATAService',
                jsonpCallback: 'getJSON',
                contentType: "application/json",
                dataType: 'json',
                success: function(data, textStatus, jqXHR) {
                    var oModel = new sap.ui.model.json.JSONModel();
                    oModel.setData(data);
                    sap.ui.getCore().setModel(oModel);
                    //Create a model and bind the table rows to this model
                    //Get the forecastday array table from txt_forecast object
                    var aData = oModel.getProperty("/d/results");
                    var aData2 = _.countBy(_.map(aData, function(d) {
                        return d.DATE;
                    }));
                    var aData3 = Object.keys(aData2).sort().map(key => ({
                        key,
                        value: aData2[key]
                    }));
                    oModel.setData({
                        modelData: aData3
                    });
                    oTable2.setModel(oModel);
                }
            });
相关问题