SAPUI5 IconTab with separate controllers handle lazy-loading

Question

This question is regarding Lazy-Loading. I read the Help portal, but that is for "one-controller-case". It is stated there, that Lazy loading should be implemented when:

In real use cases, you would do this for tabs that contain a lot of content or trigger expensive service calls to a back-end service.

But it's not mentioned how then to trigger controllers RouteMatched event, because .getTargets().display("name") doesn't trigger the event.

Asking this because Parent's local view JSON Model has data, that was gathered in Parent's Controllers _onObjectMatched function, namely this.sObjId= oEvent.getParameter("arguments").objectId; the same information I need in nested controllers - to send GET request with these parameters when Tab is clicked.

Also workaround to get properties from Parent's ViewModel would be fine.

I do not want to use .navTo function onTabSelect event - cause that triggers Route matched every Time - so if I switch between tabs - multiple same GET are sent.

Explanation on how should IconTabFilter work with separate controller is highly appreciated!

Thanks, Shanir

Marcus Marcus · Accepted Answer · 2019-09-12T10:13:07

a bit late but: I couldn't get this solved with routing either and attachDisplay didn't help as it had no context information. So I used the EventBus and that worked:

In your detail controllers bind method:

this.getView().bindElement({
  path: ...,
  events: {
    dataReceived: function () {
     sap.ui.core.Component.getOwnerComponentFor(that.getView()).getEventBus().publish(
                            "BindingDone", {
                                oContext: that.getView().getBindingContext()
                            }
                        );
                    }

And then in your controller for the IconTabBar content:

onInit: function () {
            var oEventBus = sap.ui.core.Component.getOwnerComponentFor(this.getView()).getEventBus();
            oEventBus.subscribe(
                "BindingDone",
                this.onBinding,
                this
            );
        },

and

onBinding: function (sChannelId, sEventId, oData) {
            this.getView().setBindingContext(oData.oContext);
        }

It bypasses the whole routing mechanism so if anyone has a better solution please correct me.

Best, Marcus

SAPUI5 IconTab with separate controllers handle lazy-loading

1 Answers