如何使用 XML 字符串以编程方式创建片段 [英] How to programmatically create fragment using XML string
问题描述
我有一个包含 XML 片段定义的字符串，我想使用它创建一个控件.
I have a string containing XML fragment definition, and I'd like to create a control using it.
XML 字符串示例:
var sFrag = "<core:FragmentDefinition xmlns='sap.m' xmlns:core='sap.ui.core'>
<Dialog showHeader='false' class='transparentBG dialogScrollHeight100' contentWidth='90%' afterClose='dialogAddNewAfterclose'>
<content>
<Button text='X' press='closeDialog'/>
<Text text='Hello Meirav!'/>
<HBox alignItems='Center'>
<Label text='Product Name: '/>
<Label text='{currentProduct>/Name}'/>
</HBox>
<HBox height='30px'/>
<HBox alignItems='Center'>
<Label text='Product Price: '/>
<Input value='{currentProduct>/Price}'/>
</HBox>
<HBox height='30px' />
<Button text='Save Update' press='saveUpdateFromFrag'/>
</content>
</Dialog>
</core:FragmentDefinition>"
有可能吗?
推荐答案
是的，类似于 XMLView.create，Fragment 还支持从 XML 字符串创建控件.
Yes, similar to XMLView.create, Fragment also supports creating control(s) from an XML string.
sap.ui.require([
"sap/ui/core/Core",
], Core => Core.attachInit(() => sap.ui.require([
"sap/ui/core/Fragment",
"sap/m/Button",
], async (Fragment, Button) => {
"use strict";
const dialog = await Fragment.load({
definition: `<Dialog xmlns="sap.m"
title="My Dialog"
class="sapUiResponsiveContentPadding">
<Text text="Some Dialog content.." />
<beginButton>
<Button id="myBeginButton"
text="Handle Event from Fragment"
press=".onBeginButtonPress" />
</beginButton>
</Dialog>`,
controller: { // can be just "this" in a Controller definition.
onBeginButtonPress: () => alert("Event handler triggered!"),
},
});
new Button({
text: "Open Dialog",
press: () => dialog.open(),
}).placeAt("content");
})));<script id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
data-sap-ui-libs="sap.ui.core,sap.m"
data-sap-ui-async="true"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-compatversion="edge"
data-sap-ui-xx-waitfortheme="init"
></script>
<body id="content" class="sapUiBody sapUiSizeCompact"></body>API参考:sap/ui/core/Fragment.load
PS:
PS: The <FragmentDefinition> is only required if the fragment definition contains multiple root nodes. This is not the case here, hence, it can be removed.
如果使用旧版本，您将不得不使用已弃用的 API sap.ui.xmlfragment.
If an older version is used, you'll have to fall back on the deprecated API sap.ui.xmlfragment.
const fragmentContent = `<Dialog xmlns="sap.m"><!-- ... --></Dialog>`;
const dialog = sap.ui.xmlfragment({ fragmentContent }, this/*controller*/);
需要定义属性 fragmentContent 而不是 definition，并且控制器实例应该作为第二个参数传递.
Instead of definition, the property fragmentContent needs to be defined, and the controller instance should be passed as the 2nd argument.
这篇关于如何使用 XML 字符串以编程方式创建片段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
