Using html fragments with declarative html views

问题

I am trying to decompose a large html view down into smaller, more manageable chunks.

Is it possible to use fragments to do this?

For example, i have a fragment file (view.configurator.Summary.fragment.html) containing the following:

<div data-sap-ui-type="sap.m.Button" data-text="Hello"></div>

In my parent file, I try to include the fragment as follows:

            <div data-sap-ui-type="sap.m.VBox" class="summary-panel-content">

                <div data-sap-ui-type="sap.ui.core.Fragment"
                     data-fragment-name="view.configurator.Summary" 
                     data-type="HTML"></div>

            </div>

However I get the following Error in the console:

Please provide a fragment name

Any ideas?

Thanks,

Gar.

EDIT : Seems like its a bug, but you can workaround by wrapping the fragment in a custom control

 sap.ui.core.Control.extend("sap.mic.controls.Fragment", {

    metadata: {
        properties: {
            "name": "string"
        }
    },

    init: function () {
    },

    renderer: function (renderManager, control) {
        var fragmentName = control.getProperty("name"),
            fragment = sap.ui.htmlfragment(fragmentName);

        renderManager.renderControl(fragment);
    }
});

And used like so :

<div data-sap-ui-type="sap.m.Page" data-enable-scrolling="false">

    <div data-sap-ui-type="sap.mic.controls.Fragment"
         data-name="view.configurator.Summary"></div>

</div>

回答1:

in XML-View

You have to add this namespace into XML-Header:

xmlns:mvc="sap.ui.core.mvc"

and then include the view with this:

<mvc:XMLView viewName="your.namespace.ViewName"></mvc:XMLView>

in HTML-View

You can include Views like this:

<div data-sap-ui-type="sap.ui.core.mvc.HTMLView" data-view-name="your.namespace.ViewName"></div>

XML fragment in XML view

<core:Fragment id="xmlInXml" fragmentName="my.useful.SimpleUiPart" type="XML" />

来源：https://stackoverflow.com/questions/22199437/using-html-fragments-with-declarative-html-views

标签

sap

sapui5