Связывание JSON с таблицей

Question

EDIT: Я обновил свою функцию! Я хочу, чтобы связать данные JSON с моей sap.ui.table, но я вроде понятия не имею, как это работает

Так что это мой стол:

<content> 
<t:Table id="transactionUiTable" 
       columnHeaderVisible="true" 
       selectionMode="Single" 
       selectionBehavior="RowSelector" 
       enableColumnReordering="false" 
       enableGrouping="false" 
       showColumnVisibilityMenu="false" 
       enableSelectAll="false" 
       enableCustomFilter="false" 
       enableBusyIndicator="false" 
       rows="{path: '/'}" 
       rowSelectionChange="onTableSelectionChange"> 
        <t:toolbar> 
         <Toolbar id="toolbar"> 
           <Input width="15%" id="transactionId" value="txn_18KlBw2eZvKYlo2CdHGDlpAJ"/> 
           <Button text="Search Transaction" type="Emphasized" icon="sap-icon://search" press="onTransactionByTransactionId"/> 
           <Button text="Transactionlist" type="Unstyled" press="onTransactionList"/> 
           <Button text="Customer Transactionlist" type="Unstyled" press="onCustomerTransactionList"/> 
           <ToolbarSpacer/> 
           <Button icon="sap-icon://action-settings" type="Default" /> 
         </Toolbar> 
        </t:toolbar> 
        <t:columns> 
         <t:Column id="id" hAlign="Center" width="10%"> 
          <Label id="labelId" text="Transaction Id"></Label> 
          <t:template> 
           <Text text="{orderId}"/> 
          </t:template> 
         </t:Column> 
         <t:Column id="columnDate" hAlign="Center"> 
          <Label id="labelDate" text="Date"></Label> 
         </t:Column> 
         <t:Column id="columnAmount" hAlign="Center"> 
          <Label id="labelAmount" text="Amount"></Label> 
         </t:Column> 
         <t:Column id="columnCurrency" hAlign="Center"> 
          <Label id="labelCurrency" text="Currency"></Label> 
         </t:Column> 
         <t:Column id="columnFee" hAlign="Center"> 
          <Label id="labelFee" text="Fee"></Label> 
         </t:Column> 
         <t:Column id="columnNet" hAlign="Center"> 
          <Label id="labelNet" text="Net"></Label> 
         </t:Column> 
         <t:Column id="columnType" hAlign="Center"> 
          <Label id="labelType" text="Type"></Label> 
         </t:Column> 
          <t:Column id="columnStatus" hAlign="Center"> 
          <Label id="labelStatus" text="Status"></Label> 
         </t:Column> 
        </t:columns> 
       </t:Table> 
      </content> 

При нажатии на кнопку с текстом " Поиск транзакций», я хочу, чтобы позвонить с помощью GET к услуге с TransactionID, который может быть писал в поле ввода, я уже заполнил его со значением„txn_blablabla“

так что это моя функция:

onTransactionByTransactionId : function() { 
     this.oView = this.getView(); 
     var query = this.oView.byId("transactionId").getValue(); 

     var oJsonModel = new sap.ui.model.json.JSONModel(); 
     oJsonModel.loadData("/retrieveTransacion?transactionId=" + query , {}, false); 

     var oData = oJsonModel.getProperty("/"); 
     this.oView.setModel(oData); 


    } 

так что моя переменная oData Я получил привязанную JSON, но как я могу привязать эти данные JSON к столбцам таблицы?

, например, я хочу, чтобы связать количество данных в формате JSON с колонками с идентификатором «columnAmount» ....

Answer 1

Вы на самом деле почти нет. Единственное, что вам нужно сделать, это установить модель в JSONModel, а не исходных данных JSON, то есть:

this.oView.setModel(oData); ->this.oView.setModel(oJsonModel);

Вы также можете переместить инициализацию вашего JSONModel и связывание на вид секции init, так как это не должно происходить при каждом нажатии кнопки поиска. Перемещение его к init-методу заставит ваш код работать быстрее, и я думаю, что это сделает его более понятным.

Пожалуйста, найдите немного очищаться и модифицированной версией (так что он может подключиться к службе общественного CountryList) в этом jsbin: http://jsbin.com/laqefak/1/edit?html,output