Fixed broken menu due to lint regression and route active class for menu

This commit is contained in:
Cagatay Civici 2022-10-26 18:07:41 +03:00
parent 39e8809368
commit d8eba3d2cc
2 changed files with 8 additions and 3 deletions

View File

@ -34,7 +34,7 @@ export class AppMenuComponent implements OnInit {
{ label: 'Panel', icon: 'pi pi-fw pi-tablet', routerLink: ['/uikit/panel'] },
{ label: 'Overlay', icon: 'pi pi-fw pi-clone', routerLink: ['/uikit/overlay'] },
{ label: 'Media', icon: 'pi pi-fw pi-image', routerLink: ['/uikit/media'] },
{ label: 'Menu', icon: 'pi pi-fw pi-bars', routerLink: ['/uikit/menu'], preventExact: true },
{ label: 'Menu', icon: 'pi pi-fw pi-bars', routerLink: ['/uikit/menu'], routerLinkActiveOptions: { paths: 'subset', queryParams: 'ignored', matrixParams: 'ignored', fragment: 'ignored' } },
{ label: 'Message', icon: 'pi pi-fw pi-comment', routerLink: ['/uikit/message'] },
{ label: 'File', icon: 'pi pi-fw pi-file', routerLink: ['/uikit/file'] },
{ label: 'Chart', icon: 'pi pi-fw pi-chart-bar', routerLink: ['/uikit/charts'] },

View File

@ -19,7 +19,7 @@ import { LayoutService } from './service/app.layout.service';
<i class="pi pi-fw pi-angle-down layout-submenu-toggler" *ngIf="item.items"></i>
</a>
<a *ngIf="(item.routerLink && !item.items) && item.visible !== false" (click)="itemClick($event)" [ngClass]="item.class"
[routerLink]="item.routerLink" routerLinkActive="active-route" [routerLinkActiveOptions]="item.routerLinkOptions||{exact: true}"
[routerLink]="item.routerLink" routerLinkActive="active-route" [routerLinkActiveOptions]="item.routerLinkActiveOptions||{exact: true}"
[fragment]="item.fragment" [queryParamsHandling]="item.queryParamsHandling" [preserveFragment]="item.preserveFragment"
[skipLocationChange]="item.skipLocationChange" [replaceUrl]="item.replaceUrl" [state]="item.state" [queryParams]="item.queryParams"
[attr.target]="item.target" tabindex="0" pRipple>
@ -57,7 +57,7 @@ export class AppMenuitemComponent implements OnInit, OnDestroy {
@Input() parentKey!: string;
@HostBinding('class.active-menuitem') active = false;
active = false;
menuSourceSubscription: Subscription;
@ -131,6 +131,11 @@ export class AppMenuitemComponent implements OnInit, OnDestroy {
return this.root ? 'expanded' : (this.active ? 'expanded' : 'collapsed');
}
@HostBinding('class.active-menuitem')
get activeClass() {
return this.active && !this.root;
}
ngOnDestroy() {
if (this.menuSourceSubscription) {
this.menuSourceSubscription.unsubscribe();