Topic: sidenav close on click link on small screen
marc parthoens free asked 5 years ago
We use Double Navigation with fixed SideNav & non-fixed Navbar
The expected behavior:
Sidenav is hidden (small screens)
Opened by clicking on hamburger button
Hide sidenav automatically when clicking on a link
We have tried (click)="sidenav.hide()"
The issue is that that click also hide sidenav on larger screen when it always supposed to be open.
Damian Gemza staff answered 5 years ago
Dear Marc,
Please use the below code to achieve your desired functionality:
.html:
<mdb-accordion-item class="no-collase" (click)="hideSidenavAfterClick()">
<mdb-accordion-item-head mdbWavesEffect><i
class="far fa-gem"></i> Simple link 2
</mdb-accordion-item-head>
<mdb-accordion-item-body></mdb-accordion-item-body>
</mdb-accordion-item>
.ts:
@ViewChild('sidenav') sidenav: SidenavComponent;
hideSidenavAfterClick() {
if (window.innerWidth <= 768) {
this.sidenav.hide();
}
}
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 7.4.2
- Device: small screens
- Browser: all
- OS: windows 10
- Provided sample code: No
- Provided link: No