Hi all,
I have a ui5 application where I am trying to display the Login screen with Toolpage with routing.
My App.view.xml is as below:
<mvc:View xmlns:mvc="sap.ui.core.mvc" xmlns:core="sap.ui.core" xmlns="sap.m" xmlns:tnt="sap.tnt" xmlns:l="sap.ui.layout" xmlns:f="sap.f" controllerName="myWork.controller.App" displayBlock="true"> <App id="mainApp"> <tnt:ToolPage> <tnt:header> <core:Fragment id="accSshellbarId" fragmentName="myWork.view.fragments.Shellbar" type="XML" /> </tnt:header> <tnt:sideContent> <core:Fragment id="accSideNavigationId" fragmentName="myWork.view.fragments.SideNavigation" type="XML" /> </tnt:sideContent> <tnt:mainContents> <NavContainer id="app" initialPage="page2"> <pages></pages> </NavContainer> </tnt:mainContents> </tnt:ToolPage> </App> </mvc:View>
manifest.json has following content which are relevant to this issue:
"rootView": { "viewName": "enkompass.view.App", "type": "XML" },and"routing": { "config": { "routerClass": "sap.m.routing.Router", "type": "View", "viewType": "XML", "path": "enkompass.view", "controlId": "app", "controlAggregation": "pages" },}Shellbar.fragment.xml
<core:FragmentDefinition
xmlns="sap.m"
xmlns:f="sap.f"
xmlns:core="sap.ui.core" >
<f:ShellBar title="{i18n>TITLE}" showMenuButton="true" id="myShellBar" secondTitle="Short description" showNotifications="true" menuButtonPressed="onMenuButtonPress" notificationsNumber="2" visible="{ path: 'appModel>/route/oCurrentRoute' }" >
<f:profile>
<Avatar initials="AG"/>
</f:profile>
</f:ShellBar>
</core:FragmentDefinition>
SideNavigation.fragment.xml
<core:FragmentDefinition
xmlns="sap.tnt"
xmlns:core="sap.ui.core" >
<SideNavigation
xmlns:core="sap.ui.core" expanded="true" itemSelect="onItemSelect" visible="{ path: 'appModel>/route/oCurrentRoute' }">
<NavigationList>
<NavigationListItem text="Item 1" icon="sap-icon://employee">
<NavigationListItem text="Sub Item 1" />
<NavigationListItem text="Sub Item 2" />
<NavigationListItem text="Sub Item 3" id="subItem3" key="subItem3" />
<NavigationListItem text="Sub Item 4" /></NavigationListItem>
<NavigationListItem text="Item 2" icon="sap-icon://building">
<NavigationListItem text="Sub Item 1" />
<NavigationListItem text="Sub Item 2" />
<NavigationListItem text="Sub Item 3" />
<NavigationListItem text="Sub Item 4" /></NavigationListItem>
</NavigationList>
<fixedItem>
<NavigationList>
<NavigationListItem text="Item 1" icon="sap-icon://employee" />
<NavigationListItem text="Item 2" icon="sap-icon://building" />
<NavigationListItem text="Item 3" icon="sap-icon://card" />
</NavigationList>
</fixedItem>
</SideNavigation>
</core:FragmentDefinition>
Here comes the issue:
1. I Open the URL and it only displays the login page as below (Works as expected):

2. Then after login, I see this (works as expected):

3. The I press back button from browser and instead seeing the first original login page, I get this (issue- I must be able to see the original login page, here the visible attribute inside fragments failed):

The value of appModel>/route/oCurrentRoute was set to false in App.controller.js and Login.controller.js as below:
onInit: function() { const oRouter = this.getOwnerComponent().getRouter(); oRouter.attachRoutePatternMatched(this._onRouteMatched, this); },_onRouteMatched: async function(oCurrentRoute) { this.getView().getModel('appModel').setProperty('/route/oCurrentRoute', false); },
I am literally clueless what is wrong here? I want to hide the fragments components when user hits back, I can see above lines getting called and the model property values were also changed at controller level but it does show its reflection on the UI
Need help to solve the problem