activate menu item

This commit is contained in:
nixa 2016-05-02 12:45:56 +03:00
parent 0a4cc28447
commit 0d8f5419ae
3 changed files with 28 additions and 67 deletions

View file

@ -16,8 +16,6 @@ import {SidebarStateService} from './sidebarState.service';
})
export class Sidebar {
@Input('routes') routes;
menuItems:Array<any>;
menuHeight:number;
isMenuCollapsed:boolean;
@ -30,15 +28,17 @@ export class Sidebar {
isMenuShouldCollapsed:boolean = false;
constructor(private elementRef:ElementRef,
private router:Router,
constructor(private _elementRef:ElementRef,
private _router:Router,
private _sidebarService:SidebarService,
private _sidebarStateService:SidebarStateService) {
}
ngOnInit() {
this.menuItems = this._sidebarService.getMenuItems(this.routes);
this.menuItems = this._sidebarService.getMenuItems();
this.selectMenuItem();
this._router.root.subscribe(() => this.selectMenuItem());
}
// TODO: is it really the best event for this kind of things?
@ -80,7 +80,7 @@ export class Sidebar {
updateSidebarHeight() {
// TODO: get rid of magic 84 constant
this.menuHeight = this.elementRef.nativeElement.childNodes[0].clientHeight - 84;
this.menuHeight = this._elementRef.nativeElement.childNodes[0].clientHeight - 84;
}
toggleSubMenu($event, item) {
@ -100,9 +100,9 @@ export class Sidebar {
}
private selectMenuItem() {
let isCurrent = (instruction) => (instruction ? this.router.isRouteActive(this.router.generate([instruction])) : false);
let isCurrent = (instruction) => (instruction ? this._router.isRouteActive(this._router.generate([instruction])) : false);
this.menuItems.forEach(function (menu) {
this.menuItems.forEach(function (menu: any) {
menu.selected = isCurrent(menu.name);
menu.expanded = menu.expanded || menu.selected;

View file

@ -4,6 +4,22 @@ import {Injectable} from 'angular2/core';
export class SidebarService {
staticMenuItems = [
{
title: 'Dashboard',
name: 'Dashboard',
icon: 'ion-android-home',
selected: false,
expanded: false,
order: 0
},
{
title: 'UI Features',
name: 'Ui',
icon: 'ion-android-laptop',
selected: false,
expanded: false,
order: 200
},
{
title: 'Pages',
icon: 'ion-document',
@ -58,29 +74,7 @@ export class SidebarService {
constructor() {
}
getMenuItems(routes) {
let menuItems = routes.configs
.filter(function (s) {
return s.data.sidebarMeta != null;
})
.map(function (s) {
var meta = s.data.sidebarMeta;
return {
title: s.data.title,
name: s.name,
level: 0,
order: meta.order,
icon: meta.icon
};
})
.sort(function (a, b) {
return (a.level - b.level) * 100 + a.order - b.order;
})
.filter(function (item) {
return item.level == 0;
});
return menuItems.concat(this.staticMenuItems);
getMenuItems() {
return this.staticMenuItems;
}
}