7

Suppose I have the following XML view:

<mvc:View xmlns:mvc="sap.ui.core.mvc" ...>
    <Page>
        <content>
            <l:VerticalLayout>
                <l:content>
                    <core:Fragment fragmentName="my.static.Fragment" type="XML" />
                </l:content>
            </l:VerticalLayout>
        </content>
    </Page>
</mvc:View>

The fragment my.Fragment is statically loaded. However, I now want to dynamically change the to-be-loaded fragment (ideally using data binding the fragmentName property, but any other means should be ok as well), ie. something like this:

<mvc:View xmlns:core="sap.ui.core.mvc" ...>
    <Page>
        <content>
            <l:VerticalLayout>
                <l:content>
                    <core:Fragment fragmentName="{/myDynamicFragment}" type="XML" />
                </l:content>
            </l:VerticalLayout>
        </content>
    </Page>
</mvc:View>

However, the latter does not work, and the Fragment definitions don't allow for data binding... I might have missed something, but how should I dynamically change the Fragment in my XML view based on a parameter/model property/etc?

For now, I have resorted to a custom control instead of directly using a fragment in my view, and have that control do the dispatching to the appropriate Fragment, but I feel there should be an easier, out-of-the-box way...

Boghyon Hoffmann
  • 17,103
  • 12
  • 72
  • 170
Qualiture
  • 4,900
  • 7
  • 27
  • 38
  • 4
    +1 for the idea! I´m afraid the only way to handle this is to do it in the controller which probably makes more sense as you can manage the whole life cycle of the fragment in there. – Tim Gerlach Sep 08 '14 at 06:59

2 Answers2

4

I think the only solution will be initialization of fragment from onInit method of controller:

sap.ui.controller("my.controller", {
    onInit : function(){
        var oLayout = this.getView().byId('mainLayout'), //don't forget to set id for a VerticalLayout
            oFragment = sap.ui.xmlfragment(this.fragmentName.bind(this));
        oLayout.addContent(oFragment);
    },

    fragmentName : function(){
       return "my.fragment";
    }
});
  • 1
    Thanks! However, I think a better place would be the `onAfterRendering` method, since the `onInit` will be only called once (the whole purpose of my quest is to reuse a single view and have it's content (fragments and/or inner views) change on demand – Qualiture Sep 08 '14 at 21:44
  • 3
    `sap.ui.xmlfragment` is deprecated nowadays. `sap.ui.core.Fragment.load()` should be used instead: [Documentation](https://sapui5.hana.ondemand.com/#/api/sap.ui.core.Fragment%23methods/sap.ui.core.Fragment.load) – Mario Varchmin Feb 06 '20 at 09:42
-3

The fragment name can also result from a binding, including an expression binding which evaluates to a constant. As formatter functions return strings, and not booleans, === 'true' has been added in the following example:

Example: Dynamic Fragment Name

<core:Fragment fragmentName="{= ${path: 'facet>Target', formatter: 'sap.ui.model.odata.AnnotationHelper.isMultiple'} === 'true'
    ? 'sap.ui.core.sample.ViewTemplate.scenario.TableFacet'
    : 'sap.ui.core.sample.ViewTemplate.scenario.FormFacet' }" type="XML"/>
adirocks27
  • 141
  • 1
  • 6
  • 15
  • This just can't work as `fragmentName` is not an actual property but a [member of "specialSettings"](https://github.com/SAP/openui5/blob/rel-1.52/src/sap.ui.core/src/sap/ui/core/Fragment.js#L52-L78) which is *not* bindable. – Boghyon Hoffmann Apr 16 '18 at 11:43
  • According to the documentation, this should work: https://sapui5.hana.ondemand.com/1.84.6/#/topic/65da02badf704e03a4fd6bd4c5aba8f4 . However, I also didn't manage to get this to work. – Simon Tenbeitel Mar 01 '21 at 07:30
  • 1
    @SimonTenbeitel Unfortunately, no. That documentation topic **applies only to _XML Templating_** — a less known concept for pre-processing XML views before the actual controls are created. There, [one-time binding for the `fragmentName` is specifically supported](https://github.com/SAP/openui5/blob/0070e1888dbdaa31c6dc1d4f4a4ea12cd4330d42/src/sap.ui.core/src/sap/ui/core/util/XMLPreprocessor.js#L1480-L1482), but again, only for the _XML Templating_ which has never been supported by the `Router` directly and thus not widely adopted by app developers. This answer is simply wrong and misleading. – Boghyon Hoffmann Apr 22 '21 at 21:37