0

Please or Register to create posts and topics.

Incorrect display in mat-sidenav-content

Hi,

After logging in, the application will appear as shown in the attachment. Only after a hide and show again everything is displayed to me correctly. Unfortunately, I have not found the cause so far. Can someone give me a hint here.

 

regards Ingo

Me too faced same problem. I did below to fix.

Edit : app.component.ts

Add below two declarations :

@ViewChild('mainNav') sideNav: MatSidenav;

isAppStartup: boolean = true;

And Edit ngOnInit() as below

this.router.events.subscribe(event => {
if (event instanceof NavigationStart) {
let url = (<NavigationStart>event).url;

if (url !== url.toLowerCase()) {
this.router.navigateByUrl((<NavigationStart>event).url.toLowerCase());
}

// to fix side nav overlap
if (this.isUserLoggedIn && this.isAppStartup && this.sideNav) {
this.sideNav.toggle();
}

if (this.adminExpander && url.indexOf('admin') > 0) {
this.adminExpander.open();
}

// to fix side nav overlap
if (this.isUserLoggedIn && this.isAppStartup && this.sideNav) {
this.sideNav.toggle();
this.isAppStartup = false;
}
}

Hope this helps you..

Ingo has reacted to this post.
Ingo

Hi KanKathir,
Thank you for your help. Now the site works fine.

 

Regards Ingo