Flexible Programming Model table failed to load

[MattDion]

I'm trying to use the Fiori Elements table building block in a freestyle app. The table is part of an XML fragment that gets dynamically loaded. Here's the gist of the fragment:

<core:FragmentDefinition xmlns="sap.m" xmlns:core="sap.ui.core" xmlns:macros="sap.fe.macros">...<macros:Table id="idTable" metaPath="association/@com.sap.vocabularies.UI.v1.LineItem" selectionMode="Multi" readOnly="true"/>...</core:FragmentDefinition>

When I load this fragment, I end up receiving this error message in the console, and the page stops loading:

Uncaught (in promise) ModuleError: failed to load 'sap/fe/macros/Table.js' from ../resources/sap/fe/macros/Table.js: script load error
    at se (https://port8080-workspaces-ws-45mg4.eu10.applicationstudio.cloud.sap/resources/sap-ui-core.js:10:7148)
    at ne.failWith (https://port8080-workspaces-ws-45mg4.eu10.applicationstudio.cloud.sap/resources/sap-ui-core.js:10:4989)
    at HTMLScriptElement.i (https://port8080-workspaces-ws-45mg4.eu10.applicationstudio.cloud.sap/resources/sap-ui-core.js:10:10946)
Caused by: Error: script load error
    at HTMLScriptElement.i (https://port8080-workspaces-ws-45mg4.eu10.applicationstudio.cloud.sap/resources/sap-ui-core.js:10:10988)

At the time of the fragment load, it does appear that the resource is already loaded:

Any ideas what I might be missing?

[nicolas_lunet · Accepted solution]

Hello Matt,

When loading FE building blocks within fragment you need to do that using the loadFragment method available in the extension API https://sapui5.hana.ondemand.com/#/api/sap.fe.core.ExtensionAPI%23methods/loadFragment

Hope that helps

Nicolas

[MattDion · Accepted solution]

Thank you Nicolas! That did the trick. I was trying to use sap.ui.core.Fragment to load the XML fragment.

The correct coding is more or less (from the FPM context in a page controller extension class):

this.getExtensionAPI().loadFragment({
                id: "idFragment",
                name: "<name of fragment>",
                controller: this,
                initialBindingContext: this.getBindingContext()
            }).then(function (oFragment) { });