2016-03-19 4 views
0

Я застрял в отображении данных JSONModel в моем XML-представлении. Я создал JSONModel и загрузил данные через $.ajax, который работает правильно. Вот что controller.js:Показать JSONModel в XML в SAPUI5

onInit: function() { 
    var oModel = new sap.ui.model.json.JSONModel(); 
    $.ajax({ 
     url: "http://services.odata.org/V3/Northwind/Northwind.svc/Customers?$format=json", 
     dataType: 'json', 
     success: function(result) { 
      var data = result.value; 
      oModel.setData(data); 
     } 
    }) 

    sap.ui.getCore().setModel(oModel); 

    }, 

В представлении данные должны быть отображены в таблице. Но это не работает, поэтому я думаю, что что-то не так внутри XML. Однако я не смог решить проблему:

<core:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" 
xmlns="sap.m" controllerName="webapp.view.TestPage2" xmlns:html="http://www.w3.org/1999/xhtml"> 
<Page title="TestPage 2"> 
    <content> 
     <Button text="Back" press="onPress"> 
      <layoutData> 
       <FlexItemData growFactor="1" /> 
      </layoutData> 
     </Button> 
     <Table id="idTestTable" visible="true"> 
      <columns> 
       <Column id="idColName"> 
        <Text text="Name" /> 
       </Column> 
       <Column id="idColAddress"> 
        <Text text="Address" /> 
       </Column> 
      </columns> 
      <items> 
       <ColumnListItem> 
        <cells> 
         <ObjectIdentifier text="{ContactName'}" /> 
         <Text text="{Address}" /> 
        </cells> 
       </ColumnListItem> 
      </items> 
     </Table> 
    </content> 
</Page> 
</core:View> 

Надеюсь, у вас есть совет!

ответ

0

Вы пропускаете связывающую информацию для агрегации пунктов таблицы:

<Table id="idTestTable" visible="true" items="{/}"> 

Просто добавьте элементов = «{/}» как атрибут к вашему столу. Кроме того, удалите одинарную цитату в ObjectIdentifier ...

Кстати: вы также можете использовать sap.ui.model.json.JSONModel непосредственно для загрузки данных вместо использования $ .ajax вручную. Приведенный ниже код иллюстрирует, как это сделать. Имейте в виду, что в этом случае я использую items = "{/ value}" вместо item = "{/}". Кроме того, не запутаться в URL - это требуется только из-за того же происхождения политики браузеров ...

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     <meta charset="utf-8" /> 
 
     <title>SAPUI5 single file template | nabisoft </title> 
 
     <script src="https://openui5beta.hana.ondemand.com/resources/sap-ui-core.js" 
 
      id="sap-ui-bootstrap" 
 
      data-sap-ui-theme="sap_bluecrystal" 
 
      data-sap-ui-libs="sap.m" 
 
      data-sap-ui-bindingSyntax="complex" 
 
      data-sap-ui-compatVersion="edge" 
 
      data-sap-ui-preload="async"></script> 
 
    
 
     <!-- XMLView --> 
 
     <script id="myXmlView" type="ui5/xmlview"> 
 
      <mvc:View 
 
       controllerName="MyController" 
 
       xmlns="sap.m" 
 
       xmlns:core="sap.ui.core" 
 
       xmlns:mvc="sap.ui.core.mvc"> 
 
    
 
       <Table id="idTestTable" visible="true" items="{/value}"> 
 
        <columns> 
 
         <Column id="idColName"> 
 
          <Text text="Name" /> 
 
         </Column> 
 
         <Column id="idColAddress"> 
 
          <Text text="Address" /> 
 
         </Column> 
 
        </columns> 
 
        <items> 
 
         <ColumnListItem> 
 
          <cells> 
 
           <ObjectIdentifier text="{ContactName}" /> 
 
           <Text text="{Address}" /> 
 
          </cells> 
 
         </ColumnListItem> 
 
        </items> 
 
       </Table> 
 
    
 
      </mvc:View> 
 
     </script> 
 
    
 
     <script> 
 
      sap.ui.getCore().attachInit(function() { 
 
       "use strict"; 
 
    
 
       //### Controller ### 
 
       sap.ui.controller("MyController", { 
 
        onInit : function() { 
 
         var oModel = new sap.ui.model.json.JSONModel("https://cors-anywhere.herokuapp.com/services.odata.org/V3/Northwind/Northwind.svc/Customers?$format=json"); 
 
         sap.ui.getCore().setModel(oModel); 
 
        } 
 
       }); 
 
    
 
       //### THE APP: place the XMLView somewhere into DOM ### 
 
       sap.ui.xmlview({ 
 
        viewContent : jQuery("#myXmlView").html() 
 
       }).placeAt("content"); 
 
    
 
      }); 
 
     </script> 
 
    
 
    </head> 
 
    
 
    <body class="sapUiBody"> 
 
     <div id="content"></div> 
 
    </body> 
 
</html>

+0

Спасибо, это было то, что мне нужно :) –