[Library | Trunk]: NavBar fix current route on html

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@60841 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou 2021-04-12 15:35:49 +00:00
parent 773d4d81fc
commit 17d38d59a6
2 changed files with 10 additions and 6 deletions

View File

@ -74,7 +74,7 @@
</li> </li>
<ng-container *ngIf="!onlyTop"> <ng-container *ngIf="!onlyTop">
<ng-container *ngFor="let menu of menuItems"> <ng-container *ngFor="let menu of menuItems">
<li class="uk-nav-header uk-parent " *ngIf="showHomeMenuItem && getCurrentRoute()!='/'"> <li class="uk-nav-header uk-parent " *ngIf="showHomeMenuItem && currentRoute.route !== '/'">
<a routerLinkActive="uk-link" routerLink="/">Home</a> <a routerLinkActive="uk-link" routerLink="/">Home</a>
</li> </li>
<li class="uk-nav-header uk-parent" [class.uk-active]="isTheActiveMenu(menu)" <li class="uk-nav-header uk-parent" [class.uk-active]="isTheActiveMenu(menu)"
@ -199,7 +199,7 @@
<!-- <div *ngIf="!onlyTop" class="uk-navbar-center"> --> <!-- <div *ngIf="!onlyTop" class="uk-navbar-center"> -->
<div *ngIf="!onlyTop" class="uk-navbar-right uk-position-top-right"> <div *ngIf="!onlyTop" class="uk-navbar-right uk-position-top-right">
<ul [class]="'uk-navbar-nav'+(!userMenu?' uk-margin-right':'')"> <ul [class]="'uk-navbar-nav'+(!userMenu?' uk-margin-right':'')">
<li class="uk-parent" *ngIf="showHomeMenuItem && getCurrentRoute()!='/'"> <li class="uk-parent" *ngIf="showHomeMenuItem && currentRoute.route !== '/'">
<a routerLinkActive="uk-link" routerLink="/">Home</a> <a routerLinkActive="uk-link" routerLink="/">Home</a>
</li> </li>
<ng-container *ngFor="let menu of menuItems"> <ng-container *ngFor="let menu of menuItems">

View File

@ -147,6 +147,13 @@ export class NavigationBarComponent implements OnInit, OnDestroy {
console.error('NavigationBar (component): ' + message, error); console.error('NavigationBar (component): ' + message, error);
} }
get currentRoute() {
return {
route: this.router.url.split('?')[0].split('#')[0],
fragment: this.route.snapshot.fragment
}
}
isTheActiveMenu(menu: RootMenuItem): boolean { isTheActiveMenu(menu: RootMenuItem): boolean {
if (!menu.rootItem.markAsActive) { if (!menu.rootItem.markAsActive) {
return false; return false;
@ -164,10 +171,7 @@ export class NavigationBarComponent implements OnInit, OnDestroy {
} }
isTheActiveMenuItem(menuItem: MenuItem): boolean { isTheActiveMenuItem(menuItem: MenuItem): boolean {
let currentRoute = { let currentRoute = this.currentRoute;
route: this.router.url.split('?')[0].split('#')[0],
fragment: this.route.snapshot.fragment
};
return (menuItem.route == currentRoute.route || menuItem.route == (currentRoute.route + "/")) && return (menuItem.route == currentRoute.route || menuItem.route == (currentRoute.route + "/")) &&
currentRoute.fragment == menuItem.fragment; currentRoute.fragment == menuItem.fragment;
} }