如何从控制器动态实现视图答案

【问题标题】：How to implement dynamically a view from controller如何从控制器动态实现视图
【发布时间】：2022-10-19 19:14:47
【问题描述】：

我需要你的帮助，我有这个我想动态实施的观点

<mvc:View   
    controllerName="kommissionierung1.controller.GroupeFamilial"    
    xmlns="sap.m" 
    xmlns:core="sap.ui.core"
    xmlns:grid="sap.ui.layout.cssgrid"
    xmlns:mvc="sap.ui.core.mvc" 
      xmlns:f="sap.f">
  <IconTabBar id="IconTabBarID" stretchContentHeight="true" backgroundDesign="Transparent" applyContentPadding="false" expanded="true" class="sapUiResponsiveContentPadding" >
    <items>
      <IconTabFilter text="Famille Douala" >
        <ScrollContainer height="100%" width="100%" horizontal="false" vertical="true">
          <f:GridList id="FormPart4"  items="{GroupeFamiliale>/results}" mode="SingleSelect" selectionChange="onSelectionChange_Click" class="sapUiResponsiveContentPadding">
            <f:customLayout>
              <grid:GridBasicLayout gridTemplateColumns="repeat(auto-fit, minmax(15rem, 1fr))" gridGap="0.5rem" />
              <grid:GridBoxLayout boxWidth="15.5rem" />
            </f:customLayout>

          <f:GridListItem press="onGroup_Click" type="Active" highlightText="Famille par groupage" id="gridListID" >
            <VBox height="50%" class="sapUiSmallMargin">
              <layoutData>
                <FlexItemData growFactor="1" shrinkFactor="0" />
              </layoutData>
              <VBox class="sapUiSmallMargin" >
                <HBox justifyContent="SpaceBetween">
                  <core:Icon
                    src="sap-icon://group"
                    size="2.625rem"
                    color="Default"
                    class="sapUiTinyMarginBottom" />
                </HBox>
                <Title text="Groupe familial"  class="customTextFontSize"  wrapping="true" id="group_Name"/>
                <Text text="{
                              path: 'GroupeFamilial>NumerosIdentifiant',
                               formatter: '.formatter.ConvertToIntFormat' }"  class="customTextFontSize" id="group_Ident"/>
                </VBox>
              </VBox>
            </f:GridListItem>
          </f:GridList>
        </ScrollContainer>
      </IconTabFilter>
    </items>
  </IconTabBar>
</mvc:View>

我真的不明白如何用JS来做。原因是我们可以在 Icontabfilter 中拥有 1...n 个选项卡，具体取决于模型返回给我们的内容。例如：今天：我们只有 1 个 TabFilter 和 2 个项目。明天：我们突然有了n个Tabfilter。例如，n1 有 2 个项目，n2 有 20 个项目，n3 可能只有 1 个项目...n 欢迎任何帮助和解决方案

提前谢谢

【问题讨论】：

您想拥有动态选项卡还是想在选项卡中拥有动态内容？
嗨，Marc，我想要动态标签。
然后将IconTabBar 的items 聚合绑定到模型。
你的意思是动态还是在我的实际视图中？
通常您首先将模型与您的视图连接起来（如果您的模型是在 manifest.json 或 Component.js 中创建的，则不需要）。然后，您可以在 XML 中使用模型并将控件的单个属性或聚合绑定到模型数据。

标签： javascript sapui5 ui5-tooling

【解决方案1】：

非常感谢 Marc，我只需在我的视图中添加属性 items=myModel 并根据我的数据显示 iconTabFilter 为预期的

<IconTabBar id="IconTabBarID" stretchContentHeight="true" backgroundDesign="Transparent" applyContentPadding="false" expanded="true" class="sapUiResponsiveContentPadding" ** items="GroupeFamiliale>/results" ** >

【讨论】：