Javascript SAP.UI5中的HTML表格单元格文本重叠

内部有sap.ui.core.HTML控件的文本重叠问题

我正在尝试在sap中构建sap.ui.table.table

其中一列的数据是HTML格式的。第一次展示还可以。但当我在表格上向下滚动&再次滚动到顶部时，单元格内的数据与上一个单元格的数据重叠

请参阅以下滚动前后的屏幕截图

当我第二次向下滚动鼠标时，第一列第一个单元格中的一些文本被添加。请仔细比较这两张图片

我正在尝试以下代码：

<ui:Table id="table"  enableBusyIndicator="true" rowHeight="38" columnHeaderHeight="21" enableColumnReordering="false"
       selectionMode="Single" cellClick="onCellClick"  visibleRowCountMode="Auto"  selectionBehavior="RowOnly" class="requirementTypesTable" rows="{approvalModel7>/results}">
    <ui:toolbar>
                             <Toolbar class="tableToolbar toolbar">
                                                   <SearchField id="Phrase_desc"
                              search="onSearchField" liveChange="onSearchField"
                              width="413px" class="toolbar searchfield" />
                              <SearchField id="Status_desc" liveChange="onSearchField"
                              search="onSearchField" class="toolbar"/>
                              <SearchField id="Geography_desc" liveChange="onSearchField"
                               visible="false" class="toolbar" 
                              search="onSearchField"/>
                               <SearchField id="Regulatory_desc" liveChange="onSearchField"
                                visible="false"  class="toolbar"
                              search="onSearchField"/>
                               <SearchField id="Author_desc" class="toolbar" liveChange="onSearchField"
                              search="onSearchField"/>
                             </Toolbar>
              </ui:toolbar>

    <ui:columns >
     <ui:Column   width="420px"   hAlign="Left"
     resizable="false" flexible="false"
autoResizable="true">
       <Toolbar class="">
<ToolbarSpacer/>
            <Label text="Phrases" class="headerClass commonSorting"  />

                              <ToolbarSpacer/>

                                    <Button id="idPAsc" icon="sap-icon://sort-ascending" class="ButnInner ascdecBIcon" press="onAPhrase"></Button>
                                    <Button id="idPDsc" icon="sap-icon://sort-descending" class="ButnInner ascdecBIcon" press="onDPhrase"></Button>                           
        </Toolbar> 
      <ui:template>
    <core:HTML  id="test" preferDOM="false" content="{approvalModel7>Phrase_desc}">

       </core:HTML>
      </ui:template>
     </ui:Column>
     <ui:Column hAlign="Center" 
      resizable="false" flexible="false"
autoResizable="true">
                             <Toolbar class="tableToolbar">
<ToolbarSpacer/>                             
      <Label class="headerClass commonSorting" text="Status"/>
        <ToolbarSpacer/>
                <Button id="idSAsc" icon="sap-icon://sort-ascending" class="ButnInner ascdecBIcon" press="onAStatus"></Button>
                 <Button id="idSDsc" icon="sap-icon://sort-descending" class="ButnInner ascdecBIcon" press="onDStatus"></Button>
           </Toolbar>  

      <ui:template>
       <Text class="Phrases element.style" text="{approvalModel7>Status_desc}" tooltip="{approvalModel7>Status_desc}" wrapping="false"/>
      </ui:template>
     </ui:Column>
     <ui:Column hAlign="Center"     id="geohide"     visible="false"  
      resizable="false" flexible="false"
autoResizable="true">
       <Toolbar class="tableToolbar">
                             <ToolbarSpacer/>

      <Label class="headerClass commonSorting" text="Geography"/>
        <ToolbarSpacer/>   
                                    <Button id="idGAsc" icon="sap-icon://sort-ascending" class="ButnInner ascdecBIcon" press="onAGeo"></Button>
                                    <Button id="idGDsc" icon="sap-icon://sort-descending" class="ButnInner ascdecBIcon" press="onDGeo"></Button>

                              </Toolbar>  
      <ui:template>

       <Text class="Phrases" text="{approvalModel7>Geography_desc}" tooltip="{approvalModel7>Geography_desc}" wrapping="false"/>

      </ui:template>
     </ui:Column>
     <ui:Column hAlign="Center"    id="reghide" visible="false"  
      resizable="false" flexible="false"
autoResizable="true">
      <Toolbar class="tableToolbar">
              <ToolbarSpacer/>
      <Label class="headerClass commonSorting" text="Regulatory class" />
        <ToolbarSpacer/>
                                    <Button id="idRegAsc" icon="sap-icon://sort-ascending" class="ButnInner ascdecBIcon" press="onARegC"></Button>
                                    <Button id="idRegDsc" icon="sap-icon://sort-descending" class="ButnInner ascdecBIcon" press="onDRegC"></Button>
                              </Toolbar>  
      <ui:template>

       <Text class="Phrases" text="{approvalModel7>Regulatory_desc}" tooltip="{approvalModel7>Regulatory_desc}" wrapping="false"/>

      </ui:template>
     </ui:Column>
     <ui:Column hAlign="Center"   resizable="false" flexible="false"
autoResizable="true">
      <Toolbar class="tableToolbar">
              <ToolbarSpacer/>

      <Label class="headerClass commonSorting" text="Author"/>
       <ToolbarSpacer/>
                                   <Button id="idAAsc" icon="sap-icon://sort-ascending" class="ButnInner ascdecBIcon" press="onAAuthor"></Button>
                                    <Button id="idADsc" icon="sap-icon://sort-descending" class="ButnInner ascdecBIcon" press="onDAuthor"></Button>
                              </Toolbar>  
      <ui:template>
       <Text   class="Phrases"  text="{approvalModel7>Author_desc}" tooltip="{approvalModel7>Author_desc}" wrapping="false"/>
      </ui:template>
     </ui:Column>

    </ui:columns>
   </ui:Table> 

如果有什么问题，我们将非常感谢您的帮助。

---

谢谢，我不太确定，但可能是您设置为HTML控件的内容有问题。 HTML控件旨在将HTML内容无缝地添加到控件树中。 因此，它不会在HTML周围创建额外的标记。 但作为该设计决策的副作用，HTML控件有两个重要约束：

由于它不控制其呈现的最外层DOM，因此该内容必须满足UI5对控件DOM的需求：它的ID必须等于HTML控件oHTML.getID==oHTMLControl.$.attr'ID' 要与UI5呈现和重新呈现正确集成，DOM必须只有一个根节点。UI5控件的DOM中不能有多个根节点。 您是否尝试过切换HTML控件的preferDOM选项

最后但并非最不重要的一点是，您是否尝试过

谢谢您的回复。FormattedText支持有限的html标记，所以我选择了sap.ui.core.html。是的，我试着切换首选属性，但故事还是一样的。请检查一下。