SmartTableにカスタム列を追加するには？

Question

私はsmartTableにデータを表示しています。今度は、カスタムアイコン列を1つ追加したいと思います。これは可能ですか？たとえば、私はSmartTableとJSONモデルを以下に示すように持っています。そして、JSON Modelの値をFirst ColumnにTextとして表示したいと思います。

<mvc:View 
    xmlns="sap.m" 
    xmlns:mvc="sap.ui.core.mvc" 
    controllerName="sap.ui.demo.smartControls.SmartTable" 
    xmlns:smartFilterBar="sap.ui.comp.smartfilterbar" 
    xmlns:smartTable="sap.ui.comp.smarttable"> 
    <smartFilterBar:SmartFilterBar 
    id="smartFilterBar" 
    entityType="Product"> 
    <smartFilterBar:controlConfiguration> 
    <smartFilterBar:ControlConfiguration 
    key="Category" visibleInAdvancedArea="true" 
    preventInitialDataFetchInValueHelpDialog="false"> 
    </smartFilterBar:ControlConfiguration> 
    </smartFilterBar:controlConfiguration> 
    </smartFilterBar:SmartFilterBar> 
    <smartTable:SmartTable 
    id="smartTable_ResponsiveTable" 
    smartFilterId="smartFilterBar" 
    tableType="ResponsiveTable" 
    editable="false" 
    entitySet="Products" 
    useVariantManagement="false" 
    useTablePersonalisation="false" 
    header="Products" 
    showRowCount="true" 
    useExportToExcel="false" 
    enableAutoBinding="true"> 
    </smartTable:SmartTable> 
    </mvc:View> 

とコントローラのonInit（）メソッドにはjsonモデルがあります。

var oData = { "Text": "StackOverFlow"}; 
var oModel = sap.ui.model.json.JSONModel(oData); 
sap.ui.getCore().setModel(oModel); 

よろしく、 Mayank

Answer 1

例はここにあります：

SAP Developer Guide - Smart table

私はアプリケーションでこれをやった最近、ODATAサービスで、JSONからのデータと類似していなければなりませんモデル。ここでは私のように見えるものです：

\t <smartTable:SmartTable 
 
\t \t id="gSmartTable" 
 
\t \t initialise="onSmartTable" 
 
\t \t beforeRebindTable="onBeforeRebindTable" 
 
\t \t showOverlay="onShowOverlay" 
 
\t \t entitySet="Employees" 
 
\t \t smartFilterId="gSmartFilterBar" 
 
\t \t tableType="ResponsiveTable" 
 
\t \t useExportToExcel="false" 
 
\t \t useVariantManagement="false" 
 
\t \t useTablePersonalisation="true" 
 
\t \t persistencyKey="gSmartTable_Explored" 
 
\t \t header="Workers" 
 
\t \t showRowCount="true" 
 
\t \t enableAutoBinding="true" 
 
\t \t demandPopin="true"> \t 
 
\t \t 
 
\t \t 
 
\t \t 
 
\t <!-- Build table to handle custom field --> 
 
\t \t <Table id ="gEmployeesTable" growing="true" growingScrollToLoad="true" growingThreshold="20"> 
 
\t \t \t <columns> 
 
\t \t \t <Column width="100px" hAlign="Left"> 
 
\t \t \t \t \t <customData> 
 
\t \t \t \t \t \t <!-- Custom Field --> 
 
\t \t \t \t \t \t <core:CustomData key="p13nData" 
 
\t \t \t \t \t \t \t value='\{"columnKey": "Pernr", "maxLength": "5","columnIndex":"0", "leadingProperty": "Pernr"}' /> 
 
\t \t \t \t \t </customData> 
 
\t \t \t \t \t \t <Text text="{i18n>tableColumnEmployeeID}" /> 
 
\t \t \t \t </Column> 
 
\t \t \t \t <Column width="100px" hAlign="Left"> 
 
\t \t \t \t \t <customData> 
 
\t \t \t \t \t \t <!-- Custom Field --> 
 
\t \t \t \t \t \t <core:CustomData key="p13nData" 
 
\t \t \t \t \t \t \t value='\{"columnKey": "ZQ_STAT", "maxLength": "5","columnIndex":"4", "leadingProperty": "ZQ_STAT"}' /> 
 
\t \t \t \t \t </customData> 
 
\t \t \t \t \t \t <Text text="{i18n>tableColumnStatus}" /> 
 
\t \t \t \t </Column> 
 
\t \t \t </columns> 
 
\t \t \t <items> 
 
\t \t \t \t <!-- Table Navigation --> 
 
\t \t \t \t <ColumnListItem type="Navigation" press="onPress"> 
 
\t \t \t \t \t <cells> 
 
\t \t \t \t \t \t <!-- Use formatter to dispay Pernr --> 
 
\t \t \t \t \t <Text text="{ 
 
\t \t \t \t \t path: 'Pernr', 
 
\t \t \t \t \t formatter: '.formatter.stripZeros' 
 
\t \t \t \t \t }" /> 
 
\t \t \t \t \t </cells> 
 
\t \t \t \t \t <cells> 
 
\t \t \t \t \t \t <!-- Use formatter to dispay icon colour based on status field value (0,1,2,3) --> 
 
\t \t \t \t \t \t <core:Icon 
 
\t \t \t \t \t \t src="{ 
 
\t \t \t \t \t \t \t path: 'ZQ_STAT', 
 
\t \t \t \t \t \t \t formatter: '.formatter.iconVis' 
 
\t \t \t \t \t \t \t }" 
 
\t \t \t \t \t \t color="{ 
 
\t \t \t \t \t \t \t path: 'ZQ_STAT', 
 
\t \t \t \t \t \t \t formatter: '.formatter.iconColour' 
 
\t \t \t \t \t \t \t }"/> 
 
\t \t \t \t \t </cells> 
 
\t \t \t \t </ColumnListItem> 
 
\t \t \t </items> 
 
\t \t </Table> 
 
\t <!-- End Custom Table --> 
 
\t 
 
\t <!-- End Smart Table --> 
 
\t </smartTable:SmartTable>

は、私がデータのフォーマッタで、2つのカスタムフィールドを追加することができました。カスタム列が最初に表示されるようにするには、 'columnIndex'プロパティを適切に設定します。

希望に役立ちます！