Is it possible to close the sidebar after clicking an item?
I needed to do the same this is the reply I got this reply from Atanas
This can be done by editing the main-layout.component.ts file of your application. I have highlighted the changed parts in bold :
import { Component, Injector } from '@angular/core';
import { MainLayoutGenerated } from './main-layout-generated.component';
import { LayoutService } from '@radzen/angular/dist/layout';
import { Router, NavigationEnd } from '@angular/router';
@Component({
selector: 'page-main-layout',
templateUrl: './main-layout.component.html'
})
export class MainLayoutComponent extends MainLayoutGenerated {
constructor(injector: Injector) {
super(injector);
const router = injector.get(Router);
const layoutService = injector.get(LayoutService);
router.events.subscribe(event => {
if (event instanceof NavigationEnd) {
layoutService.sidebarOpen.next(false);
}
});
}
}
After doing this the sidebar will hide when you load a new page.
If you want to hide the sidebar only below certain device size you can add an if statement
if (window.innerWidth < 768) {
layoutService.sidebarOpen.next(false);
}
2 Likes