SAPUI5多个聚合绑定

时间:2018-07-13 08:34:40

标签: xml view binding sapui5 aggregation

作为初始数据集,我有一个XML列表,该列表可以包含多个子列表。该列表应使用SAPUI5动态设置。 1.第一个列表应该是显示名称的SAPUI5列表。 2.然后,选择值应显示为SAPUI5 SegmentedButtons。 3.当用户按下SegmentedButton的最后一个按钮时,下拉列表应显示匹配的子值。

我在XML.view中做了前两点。那很好。 但是我没有填写下拉列表。如何填充下拉列表?

此外,有两种不同的类型。如果类型是“定性”,则用户将显示显示的SegmentedButtons。 如果它是“定量”类型,则用户只会得到一个空的输入字段。

See here for Sample Image

数据集

<?xml version="1.0" encoding="UTF-8"?>
<Rowsets>
     <Rowset>
         <Row>
             <Name>Taste</Name>
             <Type>qualitative</Type>
             <ID>1</ID>
             <Selection>
                <Row><Value>good</Value></Row>
                <Row><Value>acceptable</Value></Row>
                <Row><Value>unacceptable</Value></Row>
            </Selection>
         </Row>
         <Row>
             <Name>Smell</Name>
             <Type>qualitative</Type>
             <ID>2</ID>
             <Selection>
                <Row><Value>good</Value></Row>
                <Row><Value>unacceptable</Value>
                    <Selection>
                        <Row><Subvalue>like fish</Subvalue></Row>
                        <Row><Subvalue>like socks</Subvalue></Row>
                    </Selection>
                </Row>
            </Selection>
         </Row>
         <Row>
             <Name>Weight</Name>
             <Type>quantitative</Type>
             <ID>3</ID>
         </Row>
         <Row>
             <Name>Appearance</Name>
             <Type>qualitative</Type>
             <ID>4</ID>
             <Selection>
                <Row><Value>good</Value></Row>
                <Row><Value>acceptable</Value></Row>
            </Selection>
         </Row>
     </Rowset>
</Rowsets>

main.view.xml

<List 
id="List"
headerText="List" 
items="{Result>/Rowset/Row/}" >
<InputListItem label="{Result>Name}">

    <SegmentedButton selectedButton="none" items="{Result>Selection/Row/}" visible="{= ${Result>Type} === 'qualitative' }">
        <items>
            <SegmentedButtonItem key="{Result>Value}" text="{Result>Value}" />
        </items>
    </SegmentedButton>

    <Select
        visible="{= ${Result>Type} === 'qualitative' }" 
        items="{Result>Selection/Row/Selection/Row/}">
        <core:Item key="{Result>Subvalue}" text="{Result>Subvalue}" />
    </Select>

    <Input value="" visible="{= ${Result>Type} === 'quantitative' }" />
</InputListItem>

1 个答案:

答案 0 :(得分:0)

您需要对分段按钮“ SelectionChange”事件的Select控件进行ElementBinding。这将更改您的Select控件的所有绑定引用,因此您的“可见”条件将失败。因此,您需要在事件中手动将其设置为“ true”或“ false”。但是我认为这不是问题,因为如果用户在分段按钮中进行选择,那是因为它是“定性的”。

代码段here

  <List 
    id="List"
    headerText="List" 
    items="{Result>/Rowsets/Rowset/Row}" >
    <InputListItem label="{Result>Name}">

        <SegmentedButton selectedButton="none" items="{path:'Result>Selection/Row', templateShareable: true}" visible="{= ${Result>Type} === 'qualitative' }" selectionChange="onSegBtnSelected">
            <items>
                <SegmentedButtonItem key="{Result>Value}" text="{Result>Value}" />
            </items>
        </SegmentedButton>

        <Select
            visible="{= ${Result>Type} === 'qualitative'}" 
            items="{path:'Result>', templateShareable: true}">
            <core:Item key="{Result>Subvalue}" text="{Result>Subvalue}" />
        </Select>

        <Input value="" visible="{= ${Result>Type} === 'quantitative' }" />
    </InputListItem>
  </List>

这里是事件处理程序

  onSegBtnSelected(oEvent){
    var oSegBtn = oEvent.getParameters().item;
    var oBindingPath = oSegBtn.getBindingContext("Result").getPath();
    if(this.getView().getModel("Result").getProperty(oBindingPath + "/Selection")){
      var oSelect = oEvent.getSource().getParent().getContent()[1];
      oSelect.bindElement("Result>" + oBindingPath + "/Selection/Row");
      oSelect.setVisible(true);
    }
  }