SAP UI5 数据绑定中的工厂函数
工廠函數是一種更強大的從模型數據創建控件的方法。 為控件聚合的每個條目調用工廠函數,開發人員可以決定每個條目是否應由具有不同屬性的相同控件表示,甚至每個條目由完全不同的控件表示。
工廠函數帶有參數sId,它應該用作新控件的ID,以及oContext,它用于訪問條目的模型數據。 返回的對象必須是 sap.ui.core.Element 類型。 下面是如何在 XML 視圖和控制器中使用來自 List Binding(Aggregation Binding)的 JSON 模型數據來實現此場景:
<mvc:ViewcontrollerName="sap.ui.sample.App"xmlns="sap.m"xmlns:l="sap.ui.layout"xmlns:mvc="sap.ui.core.mvc"><l:VerticalLayoutcontent="{ path: '/companies', factory: '.createContent'}"class="sapUiContentPadding"width="100%"/> </mvc:View>工廠函數 .createContent 實現在控制器里:
sap.ui.define(["sap/ui/core/mvc/Controller","sap/ui/model/json/JSONModel","sap/ui/model/type/String","sap/ui/model/type/Float","sap/m/Input","sap/m/Text","sap/m/CheckBox" ], function (Controller, JSONModel, StringType, Float, Input, Text, CheckBox ) {"use strict";return Controller.extend("sap.ui.sample.App", {onInit : function () {…},createContent: function (sId, oContext) {var oRevenue = oContext.getProperty("revenue");switch(typeof oRevenue) {case "string":return new Text(sId, {text: {path: "revenue",type: new StringType()}});case "number":return new Input(sId, {value: {path: "revenue",type: new Float()}});case "boolean":return new CheckBox(sId, {checked: {path: "revenue"}});}},}); });在控制器里的工廠函數實現里,根據 revenue 的數據類型來動態創建 SAP UI5 控件。
在 App 控制器中,我們創建了一個名為 productListFactory 的新函數。工廠函數返回關聯綁定上下文的控件,類似于我們在前面步驟中定義的 XML 模板。此工廠函數返回的控件類型必須適合 sap.m.List 對象的項目聚合。在這種情況下,我們根據存儲在要創建的項目的上下文中的數據返回 StandardListItem 或 ObjectListItem。
我們通過檢查當前庫存水平以及產品是否已停產來決定返回哪種類型的控制。對于這兩個選項,我們準備并加載一個 XML 片段,以便我們可以以聲明方式定義視圖邏輯并分配當前控制器。如果庫存水平為零并且產品也已停產,那么我們使用 ProductSimple XML 片段,否則使用 ProductExtended XML 片段。
XML 片段在每種情況下只需要加載一次,因此我們通過在控制器上存儲一個輔助變量并且只加載一次來創建一個 Singleton。對于列表中的每一項,我們克隆存儲在控制器上的相應控件。此方法創建一個新的控件副本,我們可以將其綁定到列表項的上下文。請注意:在工廠函數中,我們對創建的控件的生命周期負責。
如果產品沒有停產但庫存水平為零,我們暫時缺貨。在這種情況下,我們添加了一個 ObjectAttribute,它使用 JavaScript 將 Out of Stock 消息添加到控件中。與 XML 視圖或片段中的聲明性定義類似,我們可以使用數據綁定語法來綁定屬性。在這種情況下,我們將文本綁定到資源包中的一個屬性。由于 Attribute 是列表項的子項,因此它可以訪問所有分配的模型和當前綁定上下文。
最后,我們返回顯示在列表中的控件。
總結
以上是生活随笔為你收集整理的SAP UI5 数据绑定中的工厂函数的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 新裂缝不断出现 整栋楼可怕!租户砸断承重
- 下一篇: 配麒麟710A 官方认证的二手华为nov