Как программно создать фрагмент, используя строку XML - PullRequest
Новая
       7

Как программно создать фрагмент, используя строку XML

1 голос
/ 22 апреля 2020

У меня есть строка, содержащая определение фрагмента XML, и я хотел бы создать элемент управления с ее использованием.

Пример строки 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&gt;/Name}'/>
            </HBox>
            <HBox height='30px'/>
            <HBox alignItems='Center'>
                <Label text='Product Price: '/>
                <Input value='{currentProduct&gt;/Price}'/>
            </HBox>
            <HBox height='30px' />
            <Button text='Save Update' press='saveUpdateFromFrag'/>
        </content>
    </Dialog>
</core:FragmentDefinition>"

Is это возможно?

1 Ответ

2 голосов
/ 22 апреля 2020

Да, аналогично XMLView.create, Fragment также поддерживает создание элементов управления из строки XML.

≥ UI5 1,58 

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: <FragmentDefinition> требуется, только если определение фрагмента содержит несколько root узлов. Это не тот случай, следовательно, его можно удалить.

Если используется более старая версия, вам придется использовать устаревший API sap.ui.xmlfragment . 

const fragmentContent = `<Dialog xmlns="sap.m"><!-- ... --></Dialog>`;
const dialog = sap.ui.xmlfragment({ fragmentContent }, this/*controller*/);

Вместо definition необходимо определить свойство fragmentContent и передать экземпляр контроллера в качестве второго аргумента.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...