Question

我是sap ui5的完整新手。

我试图在sap web ide中生成的网页上生成一个表格。该表的数据是通过odata服务访问的.json文件。

我到目前为止：

生成oModel：

function initModel() {
    var sUrl = "/sap/opu/odata/sap/ZGWS_someService/CollectionSet?$format=json";
    var oModel = new sap.ui.model.odata.ODataModel(sUrl, true);
    sap.ui.getCore().setModel(oModel);
}

现在我想在我的html网站上使用.json文件中的数据生成一个表。所以我必须根据项目的属性创建列，然后用当前数据填充行。

.json看起来像这样：

{
"d": {
"results": [
{
"property1": "123",
"property2": "346"
},
{
"property1": "123",
"property2": "555"
}

我还没有解决方案 - 你可以帮帮我吗？

格尔茨，西蒙

Answer 1

我在控制器中创建了表，并通过lodash对数据进行了排序。

这是好的做法吗？

var oTable = this.byId("table");
        oTable.addColumn(new sap.ui.table.Column({
            label: new sap.ui.commons.Label({
                text: "Info1"
            }),
            sortProperty: "INTST",
            template: new sap.ui.commons.TextView().bindProperty("text", "key")
        }));
        oTable.addColumn(new sap.ui.table.Column({
            label: new sap.ui.commons.Label({
                text: "Count"
            }),
            template: new sap.ui.commons.TextView().bindProperty("text", "value")
        }));
        $
            .ajax({
                url: '/.../ServiceSet',
                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.VALUE;
                    }));
                    var aData3 = Object.keys(aData2).sort().map(key => ({
                        key,
                        value: aData2[key]
                    }));
                    oModel.setData({
                        modelData: aData3
                    });
                    oTable.setModel(oModel);
                }
            });
        oTable.bindAggregation("rows", {
            path: "/modelData"
        });

使用ui5中odata服务的数据创建动态表

1 个答案: