Search code examples
sapui5sap-fiori

Navigation Problems in a sapui5 unified Shell (sap.ui.unified.Shell)


I have used unified Shell control in order to implement the facebook-like swipe menu and I integrated in it a list so that I can enter menu items. The idea is that when a user clicks on a certain list item in the menu he will get redirected to a new view. I tried to implement it by using bus.publish("nav", "to" {id:..}) but it's not working. (I have put the menu in the Curtain Pane of the Unified Shell) Can anybody help me? You can find below the respective code snippets of the view and controller.

var oListTemplate = new sap.m.StandardListItem({
            title: "{title}",
            icon: "{icon}",
            description: "{description}",
            type: sap.m.ListType.Navigation,
            customData: new sap.ui.core.CustomData({
                key: "targetPage",
                value: "{targetPage}"
            })
        });

        var oList = new sap.m.List({
            selectionChange: [oController.doNavOnSelect, oController],
            mode: sap.m.ListMode.SingleSelectMaster
        });
        oList.bindAggregation("items", "/Menu", oListTemplate);

The controller:

onInit: function() {

        this.getView().setModel(new sap.ui.model.json.JSONModel("model/menu.json"));
       this.bus = sap.ui.getCore().getEventBus();
    },


 doNavOnSelect: function(event){
     if (sap.ui.Device.system.phone) {
            event.getParameter("listItem").setSelected(false);
        }
     this.bus.publish("nav", "to", {
            id: event.getParameter('listItem').getCustomData()[0].getValue()
        });

Solution

  • Solution: Replace bus.publish with app.to

    doNavOnSelect: function(event){
        if (sap.ui.Device.system.phone) {
                event.getParameter("listItem").setSelected(false);
            }
    
        app.to(event.getParameter('listItem').getCustomData()[0].getValue());
    
        }