SAP UI5：master-detail參數傳遞問題

Question

我在SplitApp中將主參數傳遞給詳細信息頁面時遇到了一些問題。我使用在manifest.json中指定爲模型的本地JSON文件。

我可以傳遞一個對象的Id，但在這種情況下，我無法弄清楚，如何在詳細視圖中接收相應的元素，將其綁定到視圖。

我也嘗試過傳遞元素的路徑，但是在這種情況下，在我選擇一個列表項後url不會改變。

任何想法，我如何能夠顯示細節頁面上的細節？

的manifest.json：

... 
    "models": { 
      "items": { 
       "type": "sap.ui.model.json.JSONModel", 
       "uri": "model/items.json" 
      } 
     }, 
    "routing": { 
      "config": { 
       "controlId": "rootControl", 
       "viewPath": "my.try.view", 
       "viewType": "XML", 
       "async": true 
      }, 
      "routes" : [ 
       { 
        "pattern" : "", 
        "name" : "master", 
        "target" : ["detail", "master"] 
       }, 
       { 
        "pattern": "detail/{Id}", 
        "name":"detail", 
        "target": ["master", "detail"] 
       } 
      ], 
      "targets" : { 
       "master" : { 
       "viewName" : "Master", 
       "controlAggregation" : "masterPages" 
       }, 
       "detail" : { 
        "viewName" : "Detail", 
        "controlAggregation" : "detailPages" 
       } 
      } 
     }... 

Master.view.xml

<mvc:View controllerName="my.try.controller.Master" xmlns:semantic="sap.m.semantic" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m"> 
    <semantic:MasterPage title="Persons"> 
        <List id="idList" items="{items>/item}" selectionChange="onItemPressed" mode="SingleSelectMaster"> 
         <items> 
          <ObjectListItem title="{item>Date}"> 
           <firstStatus> 
            <ObjectStatus text="{item>Status}"/> 
           </firstStatus> 
          </ObjectListItem> 
         </items> 
        </List> 
     </semantic:MasterPage> 
</mvc:View> 

Master.controller.js

sap.ui.define([ 
    "sap/ui/core/mvc/Controller", 
    "sap/ui/model/json/JSONModel" 
    ], function(Controller, JSONModel) { 

     "use strict"; 

     return Controller.extend("my.try.controller.Master", { 

     onInit: function() { 
      this.oRouter = this.getOwnerComponent().getRouter(); 
     }, 

     onItemPressed: function(oEvent) { 
     // When I try with the path, nothing happens. Only passing the Id works!? 
     // var oItemID = oEvent.getParameter("listItem").getBindingContext("items").getPath().substr(1); 
      var oItemID = oEvent.getParameter("listItem").getBindingContext("items").getProperty("Id"); 
      this.oRouter.navTo("detail", { 
      Id: oItemID 
      }); 
     } 
     }); 
    }); 

Detail.view.xml

<mvc:View controllerName="my.try.controller.Detail" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:semantic="sap.m.semantic"> 
    <semantic:DetailPage title="Detail"> 
     <ObjectHeader title="{ItemName}"/> 
    </semantic:DetailPage> 
</mvc:View> 

個

Detail.controller.js

sap.ui.define([ 
     "sap/ui/core/mvc/Controller" 
     ], function(Controller) { 

      "use strict"; 

      return Controller.extend("my.try.controller.Detail", { 

      onInit: function() { 
       this.oRouter = this.getOwnerComponent().getRouter(); 
       this.oRouter.getRoute("detail").attachPatternMatched(this._onDetailRouteHit, this); 
      }, 

      _onDetailRouteHit: function(oEvent) { 

       var sID = oEvent.getParameter("arguments").Id; 
//The parameter is passed 
       alert(sID); 

//This doesn't work. How can I do this withou having a service? 
       this.getView().getModel().metadataLoaded().then(function() { 
        var sObjectPath = this.getView().getModel().createKey("ItemSet", { 
         Id : sID 
        }); 
        this.getView().bindElement({ 
         path: "/" + sObjectPath 
        }); 
       }.bind(this)); 
      } 
     }); 
    }); 

Answer 1

我會建議使用ID，而不是綁定路徑，因爲路徑URL作爲書籤收藏。使用綁定路徑時，所選詳細信息可能會在集合更改時更改。

A JSONModel沒有元數據或密鑰的概念。所以你要搜索模型的項目，構建你自己的綁定路徑：

  _onDetailRouteHit: function(oEvent) { 

       var sID = oEvent.getParameter("arguments").Id; 
//The parameter is passed 
       alert(sID); 
       var model = this.getView().getModel("items"); 

       // If you are not shure if the data has been loaded 
       // you should create a promise together with the model, 
       // fullfill it in the requestCompleted Event and 
       // execute the next lines in its then(). 

       var array = model.getProperty("/ItemSet"); 
       for(var i = 0, len=array.length; i<len; i++){ 
        if (array[i].Id===sID){ 
         this.getView().bindElement({ path: "items>/ItemSet/"+i }); 
         break; 
        } 
       } 
      }