Which SAPUI5 control can be used to display dynamic content in form of Labels or lists?

时间:2017-05-16 09:38:27

标签: sapui5

I am developing a Online Questionnaire application. In this I am using Checkbox and Labels inside a VBox and Hbox control to display the options for my answers. These answer options I am getting them from my questionnaire.json model.

Following is my App.view.xml showing the answers layout:

<VBox id="multipleChoices">
                                <items>
                                    <HBox backgroundDesign="Solid" alignItems="Center">
                                        <items>
                                            <CheckBox id="mCheckBox0"/>
                                            <Label text="" id="multipleChoice0" width="500px"/>
                                            <CheckBox id="mCheckBox1"/>
                                            <Label text="" id="multipleChoice1" width="500px"/>
                                        </items>
                                    </HBox>
                                    <HBox backgroundDesign="Solid" alignItems="Center">
                                        <items>
                                            <CheckBox id="mCheckBox2"/>
                                            <Label text="" id="multipleChoice2" width="500px"/>
                                            <CheckBox id="mCheckBox3"/>
                                            <Label text="" id="multipleChoice3" width="500px"/>
                                        </items>
                                    </HBox>
                                </items>
                            </VBox>

It gets applied in front end as follows:

Q1.png First Question

Q2.png Second Question

Problem: You can see in Q2.png 4 Labels and 4 radio buttons are being displayed even though there are only two answer options. How do I achieve the scenario where the labels's and radio buttons/ check boxes appear in same number as the answer choices and extra ones are hidden? Is there a dynamic control which can help me with this one?

2 个答案:

答案 0 :(得分:1)

您应该将问题从模型绑定到List,ListItem可以包含带有标签和复选框的模板,因此您无需关心答案的大小。你现在这样做的方式太过于静止。

答案 1 :(得分:1)

Checkbox具有 text 属性,因此您可以删除标签并在该属性中执行绑定

<CheckBox id="mCheckBox1" text="{model/textOption1}"/>
<CheckBox id="mCheckBox2" text="{model/textOption1}"/>