diff --git a/src/app/pages/pages.component.ts b/src/app/pages/pages.component.ts index c421233e..95cf1271 100644 --- a/src/app/pages/pages.component.ts +++ b/src/app/pages/pages.component.ts @@ -10,7 +10,7 @@ import {PageTop, Sidebar} from '../theme'; encapsulation: ViewEncapsulation.None, styles: [], directives: [PageTop, Sidebar], - template: `` + template: `` }) @RouteConfig([ { @@ -18,51 +18,18 @@ import {PageTop, Sidebar} from '../theme'; component: Dashboard, path: '/dashboard', useAsDefault: true, - data: { - title: 'Dashboard', - selected: false, - expanded: false, - sidebarMeta: { - icon: 'ion-android-home', - order: 0, - } - } }, { name: 'Ui', component: Ui, path: '/ui/...', - data: { - title: 'UI Features', - selected: false, - expanded: false, - sidebarMeta: { - icon: 'ion-android-laptop', - order: 200, - } - } }, ]) export class Pages { - private _routeConfig; - - constructor(private _router:Router) { + constructor() { } ngOnInit() { } - - getRoutes() { - - if (!this._routeConfig) { - this._routeConfig = Reflect.getMetadata('annotations', this.constructor) - .filter(a => { - return a.constructor.name === 'RouteConfig'; - }) - .pop(); - } - - return this._routeConfig; - } } diff --git a/src/app/theme/sidebar/sidebar.component.ts b/src/app/theme/sidebar/sidebar.component.ts index 11c14f7a..2b6d14b8 100644 --- a/src/app/theme/sidebar/sidebar.component.ts +++ b/src/app/theme/sidebar/sidebar.component.ts @@ -16,8 +16,6 @@ import {SidebarStateService} from './sidebarState.service'; }) export class Sidebar { - @Input('routes') routes; - menuItems:Array; 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; diff --git a/src/app/theme/sidebar/sidebar.service.ts b/src/app/theme/sidebar/sidebar.service.ts index 3e140b7e..2edddf0a 100644 --- a/src/app/theme/sidebar/sidebar.service.ts +++ b/src/app/theme/sidebar/sidebar.service.ts @@ -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; } }