SideNav active links are not handled correctly

Topic: SideNav "active" links are not handled correctly

gordysc pro asked 3 years ago

Expected behavior

I've seen 2 issues with the SideNav in the pro bundle.

  1. If you have an accordion menu with several child links on the sidenav, the menu is not expanded on a hard browser refresh to show the active child link. The parent menu item shows the chevron as if it's expanded, but the styles are incorrect so the submenu is not shown.
  2. If a sidenav menu item is active and you click on the top navbar link, the sidenav item is not deselected appropriately. If you double click the sidenav item and then click the top navbar link it is deselected appropriately. It appears the sidenav component is not handling state correctly.

Actual behavior

  1. The sidenav expands the menu with the active child link
  2. The sidenav respects the active route and deselects an active link if another route is active.

Resources (screenshots, code snippets etc.)

I have a very basic example from 8.1.1 almost out of the box using this site's examples with GIF demonstrations of both issues in a ZIP if you'd like to investigate this further.

Arkadiusz Idzikowski staff commented 3 years ago

Did you try the example from this section?

Please send this demo zip to, that will be very helpful.

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 8.1.1
  • Device: Any
  • Browser: Any
  • OS: Any
  • Provided sample code: No
  • Provided link: No