Hinzufügen von Kontrollkästchen in SAPUI5 Liste

Question

Sehr geehrte SAPUI5 Entwickler,

Ich machte eine Master-Details-Anwendung.

Ich möchte diese Fähigkeit dem Benutzer geben, die mehrere Artikel auswählen und drücken Sie dann die Taste Löschen.

Zu diesem Zweck muss ich einige Checkboxen vor Listenelementen hinzufügen. Die Daten für die Liste stammen aus dem OData-Service. Hier

ist der Code für die Liste:

<List id="list" items="{ path: '/GewerkSet', sorter: { path: 'ZTradeName', descending: false }, groupHeaderFactory: '.createGroupHeader' }" busyIndicatorDelay="{masterView>/delay}" noDataText="{masterView>/noDataText}" mode="{= ${device>/system/phone} ? 'None' : 'SingleSelectMaster'}" growing="true" growingScrollToLoad="true" updateFinished="onUpdateFinished" selectionChange="onSelectionChange"> 
<infoToolbar> 
    <Toolbar active="true" id="filterBar" visible="{masterView>/isFilterBarVisible}" press="onOpenViewSettings"> 
     <Title id="filterBarLabel" text="{masterView>/filterBarLabel}"/> 
    </Toolbar> 
</infoToolbar> 
<items> 
    <ObjectListItem type="{= ${device>/system/phone} ? 'Active' : 'Inactive'}" press="onSelectionChange" title="{ZTradeName}" showMarkers="true"/> 
</items> 
</List> 

Und hier ist ein Bild von dem, was ich brauche. Bitte beachten Sie das Kontrollkästchen vor dem Listeneintrag:

Answer 1

Sie müssen nur die items sich ändern mit CustomListItem:

<List id="list" items="{ path: '/GewerkSet', sorter: { path: 'ZTradeName', descending: false }, groupHeaderFactory: '.createGroupHeader' }" busyIndicatorDelay="{masterView>/delay}" noDataText="{masterView>/noDataText}" 
      mode="{= ${device>/system/phone} ? 'None' : 'SingleSelectMaster'}" growing="true" growingScrollToLoad="true" 
      updateFinished="onUpdateFinished" selectionChange="onSelectionChange"> 
<infoToolbar> 
    <Toolbar active="true" id="filterBar" visible="{masterView>/isFilterBarVisible}" press="onOpenViewSettings"> 
     <Title id="filterBarLabel" text="{masterView>/filterBarLabel}"/> 
    </Toolbar> 
</infoToolbar> 
<CustomListItem type="Inactive"> 
    <CheckBox text="{ZTradeName}" press="onSelectionChange" showMarkers="true"/> 
</CustomListItem> 

ich es getestet und es funktioniert gut. Hier ist ein Bild des Ausgangs: