SAPUI5：将OData与同一表中的其他Web服务组合

Question

这个问题是关于使用SAP Web IDE开发SAPUI5。 我想将OData-Service与仅通过POST方法调用的Web服务结合在一起。 所以基本上就是这样：我从OData服务（从后端SAP系统中）检索一个列表，并将其显示在table元素中。 到现在为止还挺好。 有用。

现在，对于表中的每一行，我想使用POST方法调用Web服务来检索我也想在该行中显示的值。 喜欢：

第1列的行值为A，第2列的行值为B，我将其传递给Web服务，该服务告诉我“对于A和B，结果为X”。 所以我想在同一行的另一列中显示X。

如何做到这一点？ 您知道任何例子吗？

Answer 1

使用AJAX POST响应中的数据创建一个JSON模型。 将表中所需的单元格绑定到此新的JSON模型。 然后，如果要根据从OData接收的每个特定行的值在JSON模型中进行选择数据，请使用包含部分的格式化程序功能。

这是一个从罗斯文（Northwind）获取数据和带有伪数据的JSON模型的示例： https : //jsbin.com/racenaqoki/edit?html,output

使用真正的AJAX调用： https : //jsbin.com/jivomamuvi/edit?html，输出

<html>
<head>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <meta charset="utf-8">

    <title>MVC with XmlView</title>

    <!-- Load UI5, select "blue crystal" theme and the "sap.m" control library -->
    <script id='sap-ui-bootstrap'
        src='https://sapui5.hana.ondemand.com/resources/sap-ui-core.js'
        data-sap-ui-theme='sap_bluecrystal'
        data-sap-ui-libs='sap.m'
        data-sap-ui-xx-bindingSyntax='complex'></script>


    <!-- DEFINE RE-USE COMPONENTS - NORMALLY DONE IN SEPARATE FILES -->

    <!-- define a new (simple) View type as an XmlView
     - using data binding for the Button text
     - binding a controller method to the Button's "press" event
     - also mixing in some plain HTML
     note: typically this would be a standalone file -->

    <script id="view1" type="sapui5/xmlview">
    <mvc:View xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" controllerName="my.own.controller">
        <Page>
        <Table items="{/Orders}" updateFinished="onTableUpdateFinished">
      <columns>
          <Column >
              <Text text="My Value From OData"/>
          </Column>
          <Column>
              <Text text="My Value From AJAX"/>
          </Column>
      </columns>
      <items>
          <ColumnListItem>
            <cells>
              <ObjectIdentifier title="{CustomerID}"/>
              <ObjectIdentifier text="{parts:[{path:'CustomerID'}, {path:'myOtherModel>/'}], formatter: '.myFormatter'}"/>
            </cells>
        </ColumnListItem>
      </items>
    </Table>
        </Page>
    </mvc:View> 
</script>


    <script>
        // define a new (simple) Controller type
        sap.ui.controller("my.own.controller", {
          onInit: function(){
              var myOtherModel = new sap.ui.model.json.JSONModel();
              this.getView().setModel(myOtherModel, "myOtherModel");

              //Here your AJAX call to get the data from a POST request
              /*
                $.ajax({
          type: "POST",
          url: url,
          data: data,
          success: this.ajaxSuccess,
          dataType: dataType
        });
              */

              //Let's simulate that there was a success receiving the following data
              var data = {
                VINET: {
                  message: "VINET Rocks!!"
                },
                WARTH: {
                  message: "WARTH is good company!!"
                },
                RICSU: {
                  message: "RICSU I don't like"
                },
                HANAR: {
                  message: "HANAR was my first customer"
                }
              }
              this.ajaxSuccess(data);
            },

            ajaxSuccess: function(data){
              this.getView().getModel("myOtherModel").setData(data)
            },

            myFormatter: function(sCustomerID, otherModelData){
              // This formatter will be executed for each table row. 
              // In the first parameter, the value binded in the first column
              // In the second parameter, the node you want of your second model (in this case the root node)

              //do whatever you want here and return a string for the 'text' property in this case
              if(otherModelData[sCustomerID]){
                // If there is a node in your second model with a node for the given Customer ID, then return the message into it
                return otherModelData[sCustomerID].message;
              }
              //Otherwise return empty string
              return "";
            }
        });



        /*** THIS IS THE "APPLICATION" CODE ***/
        // create a Model and assign it to the View
        // Using here the HEROKU Proxy to avoid a CORS issue
        var uri = "https://cors-anywhere.herokuapp.com/services.odata.org/Northwind/Northwind.svc"; // local proxy for cross-domain access
        var oNorthwindModel = new sap.ui.model.odata.ODataModel(uri, {
            maxDataServiceVersion: "2.0"
        }); 
        // instantiate the View
        var myView = sap.ui.xmlview({viewContent:jQuery('#view1').html()}); // accessing the HTML inside the script tag above
        // Set the OData Model
        myView.setModel(oNorthwindModel);


        myView.placeAt('content');
    </script>

</head>
<body id='content' class='sapUiBody'>
</body>

Answer 2

您可以扩展oData服务，以便实体包含“ webservice_result”属性。 在数据提供程序类中，您将将该属性留空，而仅返回“ A”和“ B”值。

调用oData服务并获取结果后，您只需使用带有值A，B的ajax调用其他Web服务，当您获得结果时，只需将给定行（实体）的“ webservice_result”属性设置为使用oDataModel.setProperty("row_x/webservice_result", value)返回的值oDataModel.setProperty("row_x/webservice_result", value)

看到：

jQuery.ajax

setProperty方法

SAPUI5：将OData与同一表中的其他Web服务组合

问题描述

2 个解决方案

解决方案1
4 已采纳 2018-02-27 15:16:45

解决方案2
-1 2018-02-27 14:42:38

SAPUI5：将OData与同一表中的其他Web服务组合

问题描述

2 个解决方案

解决方案1 4 已采纳 2018-02-27 15:16:45

解决方案2 -1 2018-02-27 14:42:38

解决方案1
4 已采纳 2018-02-27 15:16:45

解决方案2
-1 2018-02-27 14:42:38