mirror of
https://github.com/Alfresco/alfresco-content-app.git
synced 2025-09-24 14:31:16 +00:00
make navigation work with routerLinkActive (#7)
This commit is contained in:
committed by
Denys Vuika
parent
16eda621b6
commit
df07ad48fd
@@ -50,17 +50,14 @@
|
||||
</md-menu>
|
||||
</div>
|
||||
|
||||
<div class="sidenav__section" *ngFor="let list of menus;">
|
||||
<div class="sidenav__section" *ngFor="let list of navigation">
|
||||
<ul class="sidenav-menu">
|
||||
<li class="sidenav-menu__item" *ngFor="let item of list">
|
||||
<!-- [routerLinkActive]="'sidenav-menu__item-link--active'" -->
|
||||
<a
|
||||
class="sidenav-menu__item-link"
|
||||
routerLinkActive="sidenav-menu__item-link--active"
|
||||
[routerLink]="item.route.url"
|
||||
[ngClass]="{
|
||||
'disabled': item.disabled,
|
||||
'sidenav-menu__item-link--active': (currentRoute.includes(item.route.url))
|
||||
}"
|
||||
[ngClass]="{ 'disabled': item.disabled }"
|
||||
title="{{ item.title || '' | translate }}">
|
||||
<md-icon>{{ item.icon }}</md-icon>
|
||||
{{ item.label | translate }}
|
||||
|
@@ -23,7 +23,6 @@ import { MinimalNodeEntryEntity } from 'alfresco-js-api';
|
||||
import { AlfrescoContentService } from 'ng2-alfresco-core';
|
||||
|
||||
import { BrowsingFilesService } from '../../common/services/browsing-files.service';
|
||||
import { Router, NavigationEnd } from '@angular/router';
|
||||
|
||||
@Component({
|
||||
selector: 'app-sidenav',
|
||||
@@ -32,71 +31,63 @@ import { Router, NavigationEnd } from '@angular/router';
|
||||
})
|
||||
export class SidenavComponent implements OnInit, OnDestroy {
|
||||
node: MinimalNodeEntryEntity = null;
|
||||
currentRoute = '';
|
||||
|
||||
onChangeParentSubscription: Subscription;
|
||||
|
||||
constructor(
|
||||
private router: Router,
|
||||
private browsingFilesService: BrowsingFilesService,
|
||||
private contentService: AlfrescoContentService
|
||||
) {
|
||||
this.currentRoute = this.router.routerState.snapshot.url;
|
||||
}
|
||||
|
||||
get menus() {
|
||||
const main = [
|
||||
navigation = [
|
||||
[
|
||||
{
|
||||
icon: 'folder',
|
||||
label: 'APP.BROWSE.PERSONAL.SIDENAV_LINK.LABEL',
|
||||
title: 'APP.BROWSE.PERSONAL.SIDENAV_LINK.TOOLTIP',
|
||||
disabled: false,
|
||||
route: { url: '/personal-files' }
|
||||
},
|
||||
{
|
||||
icon: 'group_work',
|
||||
label: 'APP.BROWSE.LIBRARIES.SIDENAV_LINK.LABEL',
|
||||
title: 'APP.BROWSE.LIBRARIES.SIDENAV_LINK.TOOLTIP',
|
||||
disabled: false,
|
||||
route: { url: '/libraries' }
|
||||
}
|
||||
];
|
||||
|
||||
const secondary = [
|
||||
],
|
||||
[
|
||||
{
|
||||
icon: 'people',
|
||||
label: 'APP.BROWSE.SHARED.SIDENAV_LINK.LABEL',
|
||||
title: 'APP.BROWSE.SHARED.SIDENAV_LINK.TOOLTIP',
|
||||
disabled: false,
|
||||
route: { url: '/shared' }
|
||||
},
|
||||
{
|
||||
icon: 'schedule',
|
||||
label: 'APP.BROWSE.RECENT.SIDENAV_LINK.LABEL',
|
||||
title: 'APP.BROWSE.RECENT.SIDENAV_LINK.TOOLTIP',
|
||||
disabled: false,
|
||||
route: { url: '/recent-files' }
|
||||
},
|
||||
{
|
||||
icon: 'star',
|
||||
label: 'APP.BROWSE.FAVORITES.SIDENAV_LINK.LABEL',
|
||||
title: 'APP.BROWSE.FAVORITES.SIDENAV_LINK.TOOLTIP',
|
||||
disabled: false,
|
||||
route: { url: '/favorites' }
|
||||
},
|
||||
{
|
||||
icon: 'delete',
|
||||
label: 'APP.BROWSE.TRASHCAN.SIDENAV_LINK.LABEL',
|
||||
title: 'APP.BROWSE.TRASHCAN.SIDENAV_LINK.TOOLTIP',
|
||||
disabled: false,
|
||||
route: { url: '/trashcan' }
|
||||
}
|
||||
]
|
||||
];
|
||||
|
||||
return [ main, secondary ];
|
||||
}
|
||||
constructor(
|
||||
private browsingFilesService: BrowsingFilesService,
|
||||
private contentService: AlfrescoContentService
|
||||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.router.events.subscribe((event) => {
|
||||
if (event instanceof NavigationEnd ) {
|
||||
this.currentRoute = event.url;
|
||||
}
|
||||
});
|
||||
|
||||
this.onChangeParentSubscription = this.browsingFilesService.onChangeParent
|
||||
.subscribe((node: MinimalNodeEntryEntity) => {
|
||||
this.node = node;
|
||||
|
Reference in New Issue
Block a user