时间戳

首页 > 解决方案 > 如何在包含控件的 sap.uxap.BlockBase 上设置“fieldGroupIds”？

sapui5 - 如何在包含控件的 sap.uxap.BlockBase 上设置“fieldGroupIds”？

问题描述

假设我有一个像这个示例应用程序这样的 SAPUI5 应用程序。

从这个应用程序的代码中可以看出，视图以某种方式分成几个块并附加到主视图，如下所示：

<ObjectPageSubSection title="Payment information">
    <blocks>
            <personal:PersonalBlockPart1 id="part1"/>
    </blocks>
    <moreBlocks>
            <personal:PersonalBlockPart2 id="part2"/>
    </moreBlocks>
</ObjectPageSubSection>

并且PersonalBlockPart1已被拆分为两个文件，如下所示：

<mvc:View xmlns:mvc="sap.ui.core.mvc" xmlns:core="sap.ui.core" xmlns:forms="sap.ui.layout.form" xmlns="sap.m">

    <forms:SimpleForm editable="false" layout="ColumnLayout">
        <core:Title text="Main Payment Method"/>

        <Label text="Bank Transfer"/>
        <Text text="Sparkasse Heimfeld, Germany"/>

    </forms:SimpleForm>

</mvc:View>

sap.ui.define(['sap/uxap/BlockBase'], function (BlockBase) {
    "use strict";

    var BlockJobInfoPart1 = BlockBase.extend("sap.uxap.sample.SharedBlocks.employment.BlockJobInfoPart1", {
        metadata: {
            views: {
                Collapsed: {
                    viewName: "sap.uxap.sample.SharedBlocks.employment.BlockJobInfoPart1",
                    type: "XML"
                },
                Expanded: {
                    viewName: "sap.uxap.sample.SharedBlocks.employment.BlockJobInfoPart1",
                    type: "XML"
                }
            }
        }
    });

    return BlockJobInfoPart1;
});

如果我想设置一个直接的方法是在代码片段中fieldGroupIds做到这一点！xml例如：

<Text text="Sparkasse Heimfeld, Germany" fieldGroupIds="XYZ1"/>

我的问题是如何在父视图中执行此操作，如下所示：

<blocks>
    <personal:PersonalBlockPart1 id="part1" fieldGroupIds="XYZ1"/>
</blocks>
<moreBlocks>
    <personal:PersonalBlockPart2 id="part2" fieldGroupIds="XYZ2"/>
</moreBlocks>

我试过了，显然它不适用于儿童控件。但是，我认为可能有一种解决方案可以从主 XML 视图中读取此属性，并将其应用于JS所有封闭控件的文件中，如下所示：

sap.ui.define(['sap/uxap/BlockBase'], function (BlockBase) {
    "use strict";

    var BlockJobInfoPart1 = BlockBase.extend("sap.uxap.sample.SharedBlocks.employment.BlockJobInfoPart1", {
        metadata: {
            views: {
                Collapsed: {
                    viewName: "sap.uxap.sample.SharedBlocks.employment.BlockJobInfoPart1",
                    type: "XML"
                },
                Expanded: {
                    viewName: "sap.uxap.sample.SharedBlocks.employment.BlockJobInfoPart1",
                    type: "XML"
                }
            }
        },
        
        onViewInit: function(){
            // pseudocode
            var sFieldGroupIds = this.getFieldGroupIds();
            var aControls = this.getAllFeidls();
            iterate over aControls and set the sFieldGroupId
        }
    });

    return BlockJobInfoPart1;
});

标签： sapui5

解决方案

我必须使用以下onBeforeRendering功能：

sap.ui.define(['sap/uxap/BlockBase'], function (BlockBase) {
    "use strict";

var setFieldGroupIdsRecursively = function (oControl, sFieldGroupIds) {
        var aPossibleAggregations = ["items", "content", "form", "formContainers", "formElements", "fields", "cells"];
        if (oControl instanceof sap.m.InputBase || oControl instanceof sap.ui.comp.smartfield.SmartField) {
            oControl.setFieldGroupIds(sFieldGroupIds);
            return;
        }
        for (var i = 0; i < aPossibleAggregations.length; i += 1) {
            var aControlAggregation = oControl.getAggregation(aPossibleAggregations[i]);
            if (aControlAggregation) {
                // generally, aggregations are of type Array
                if (aControlAggregation instanceof Array) {
                    for (var j = 0; j < aControlAggregation.length; j += 1) {
                        setFieldGroupIdsRecursively(aControlAggregation[j], sFieldGroupIds);
                    }
                }
                else { // ...however, with sap.ui.layout.form.Form, it is a single object *sigh*
                    setFieldGroupIdsRecursively(aControlAggregation, sFieldGroupIds);
                }
            }
        }
    };

    var BlockJobInfoPart1 = BlockBase.extend("sap.uxap.sample.SharedBlocks.employment.BlockJobInfoPart1", {
        metadata: {
            views: {
                Collapsed: {
                    viewName: "sap.uxap.sample.SharedBlocks.employment.BlockJobInfoPart1",
                    type: "XML"
                },
                Expanded: {
                    viewName: "sap.uxap.sample.SharedBlocks.employment.BlockJobInfoPart1",
                    type: "XML"
                }
            }
        },
        
        onBeforeRendering: function () {
            var aFieldGroupIds = this.getFieldGroupIds(),
                sFieldGroupIds = "";
            if (aFieldGroupIds.length > 0) {
                sFieldGroupIds = aFieldGroupIds.join();
                var oView = sap.ui.getCore().byId(this.getSelectedView());
                if (oView) {
                    var aContent = oView.getContent();
                    for (var j = 0; j < aContent.length; j++) {
                        setFieldGroupIdsRecursively(aContent[j], sFieldGroupIds);
                    }
                }
            }
        }
        
    });

    return BlockJobInfoPart1;
});

推荐阅读