Navbar Mobile Collapse question

Topic: Navbar Mobile Collapse question

sameretto asked 2 years ago

Hi, If I want to keep the menu open when a person clicks on an item how would I do so? Right now I have a ViewChild of the Navbar and I show it again if the user clicks. This is ok but causes a small flickering issue because it closes and opens again. If I can avoid it closing at all until a person has clicked on the hamburger menu icon to close it that would be great.

This effect is only desired when it goes to the hamburger menu mode.

html code:

Damian Gemza staff answered 2 years ago

Dear sameretto,

The navbar on mobile devices will hide automatically after the click if the link which has been clicked contains a routerLink directive.

If you don't want this behavior - to navbar not hide after clicking on a link, please use the Router's navigate() method.

Here's the sample code which works fine for me:


<li class="nav-item active">
 <a class="nav-link waves-light" mdbWavesEffect (click)="navigateTo('home')">Home<span class="sr-only">(current)</span></a>


constructor(private router: Router) {


  navigateTo(path: string){

Best Regards,


Please insert min. 20 characters.


Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: Angular
  • MDB Version: 7.4.1
  • Device: Mobile
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: Yes