共计 1857 个字符,预计需要花费 5 分钟才能阅读完成。
工厂函数是一种更弱小的从模型数据创立控件的办法。为控件聚合的每个条目调用工厂函数,开发人员能够决定每个条目是否应由具备不同属性的雷同控件示意,甚至每个条目由齐全不同的控件示意。
工厂函数带有参数 sId,它应该用作新控件的 ID,以及 oContext,它用于拜访条目标模型数据。返回的对象必须是 sap.ui.core.Element 类型。上面是如何在 XML 视图和控制器中应用来自 List Binding(Aggregation Binding)的 JSON 模型数据来实现此场景:
<mvc:View
controllerName="sap.ui.sample.App"
xmlns="sap.m"
xmlns:l="sap.ui.layout"
xmlns:mvc="sap.ui.core.mvc">
<l:VerticalLayout
content="{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 是列表项的子项,因而它能够拜访所有调配的模型和以后绑定上下文。
最初,咱们返回显示在列表中的控件。