将json绑定到ui5 ObjectPageLayout动态

时间:2016-03-17 14:12:15

标签: json xml sapui5

我有一个JSON,想要创建一个ObjectPageLayeout的动态Sections和Subsections。我的JSON如下所示

{
    "settings": {
      "Group1": [
        {
          "Group2": [
            {
              "Group3": [
                {
                  "value1": "asdf",
                  "value2": "5",
                  "value3": "2"
                },
                {
                  "value1": "jkl",
                  "value2": "2",
                  "value3": "0"
                }
              ],
              "Name2": "NameGr2"
            }
          ],
          "Name1": "NameGr1"
        }
      ]
    }
  }

我的数据由ajax提供。

var oConfig = oData.Payload.Value[0];

    this.models.mysettings = new util.JsonModel({
        modelData: oConfig.settings
    });
    this.models.mysettings.setDefaultBindingMode('TwoWay');
    oView.setModel(this.models.mysettings, 'mysettings');

现在我想在我的xml视图中创建一个ObcectPageLayout,如

<m:Page>

    <ObjectPageLayout 
      enableLazyLoading="false"
      id="ObjectPageLayout">

      <headerTitle>
        <ObjectPageHeader objectTitle="Settings">
        </ObjectPageHeader>
      </headerTitle>

      <sections>

        <ObjectPageSection

          title="{mysettings>Name2}">

          <subSections>

            <ObjectPageSubSection
              title="{mysettings>value1}">

              <blocks>
                <l:Grid

                  defaultSpan="L12 M12 S12"

                  width="auto">

                  <l:content>

                    <forms:SimpleForm

                      minWidth="1024"
                      maxContainerCols="2"
                      editable="true"
                      layout="ResponsiveGridLayout"
                      labelSpanL="3"
                      labelSpanM="3"
                      emptySpanL="3"
                      emptySpanM="3"
                      columnsL="1"
                      columnsM="1"
                      class="editableForm">

                      <m:Label text="value2" />
                      <m:Input value="{mysettings>value2}"  />

                      <m:Label text="value3" />
                      <m:Input value="{mysettings>value3}"  />

                    </forms:SimpleForm>
                  </l:content>
                </l:Grid>
              </blocks>

            </ObjectPageSubSection>
          </subSections>
        </ObjectPageSection>
      </sections>

    </ObjectPageLayout>

  </m:Page>

你有任何想法处理这个吗?

1 个答案:

答案 0 :(得分:0)

目前还不清楚您要实现的目标或发布的位置,但以下是如何使用您的数据显示ObjectPageLayout的示例:http://plnkr.co/edit/xXrMUggbvIkzQSMycVYa

您似乎错过的是部分和子部分的聚合绑定:

<ObjectPageLayout sections="{mysettings>/settings/Group1/0/Group2}">
    <sections>
        <ObjectPageSection title="{mysettings>Name2}" subSections="{mysettings>Group3}">
            <subSections>
                <ObjectPageSubSection title="{mysettings>value1}">