SAP UI5 - 檢視



檢視使用 SAP 庫定義如下:

  • XML 與 HTML 混合或獨立:庫 - sap.ui.core.mvc.XMLView
  • JavaScript:庫 - sap.ui.core.mvc.JSView
  • JSON:庫 - sap.ui.core.mvc.JSONView
  • HTML:庫 - sap.ui.core.mvc.HTMLView

JavaScript 檢視示例

Sap.ui.jsview(“sap.hcm.address”, {
   getControllerName: function() {
      return “sap.hcm.address”;
   },
   createContent: function(oController) {
      var oButton = new sap.ui.commons.Button({ text: “Hello” });
      oButton.attachPress(function() {
         oController.Hello();
      })
      Return oButton;
   }
});

HTML 檢視示例

<template data-controller-name = ”sap.hcm.address’>
   <h1>title</h1>
   <div> Embedded html </div>
   <div class = ”test” data-sap-ui-type = ”sap.ui.commons.Button”
      Id = ”Button1” data-text =  ”Hello” Data-press = ”sayHello”>
   </div>
</template>

類似地,您可以建立從 sap.ui.core.mvc.JsonView 派生的 JSON 檢視。

{
   “type”:”sap.ui.core.mvc.JsonView”,
   “controllerName”:”sap.hcm.address”,
   ……………………….
   …………………...
   …………………….
}

檢視型別的比較

下表列出了與 MVC 概念相關的關鍵特性,以及不同檢視型別關於這些特性的比較。

特性 JS 檢視 XML 檢視 JSON 檢視 HTML 檢視
標準和自定義庫
字串、整數、布林值、浮點數型別的屬性
聚合 1:1,1:n 關聯 1:1,1:n
簡單資料繫結
自定義資料繫結
嵌入式 HTML
程式碼完成
模板
驗證
單個事件監聽器
廣告