- SAP UI5 教程
- SAP UI5 - 首頁
- SAP UI5 - 概述
- SAP UI5 - 架構
- SAP UI5 - 關鍵元件
- SAP UI5 - 控制庫
- SAP UI5 - 開發工具包
- SAP UI5 - MVC 概念
- SAP UI5 - 檢視
- SAP UI5 - 開發者工作室
- SAP UI5 - 建立 UI5 專案
- SAP UI5 - 控制元件
- SAP UI5 - 資料繫結
- SAP UI5 - 設計模式
- SAP UI5 - 模組化
- SAP UI5 - 本地化
- SAP UI5 - 記事本控制元件
- SAP UI5 - 擴充套件應用程式
- SAP UI5 - 主題
- SAP UI5 - 移動
- 在 Web IDE 中建立專案
- SAP UI5 有用資源
- SAP UI5 - 快速指南
- SAP UI5 - 有用資源
- SAP UI5 - 討論
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 | 否 | 是 | 否 | 否 |
| 程式碼完成 | 是 | 是 | 否 | 否 |
| 模板 | 是 | 否 | 否 | 否 |
| 驗證 | 否 | 是 | 否 | 否 |
| 單個事件監聽器 | 是 | 是 | 是 | 是 |
廣告
