Added a way to swap navigation model on the fly

Moved the navigation service to the app.module since we need it to be a singleton at all times
This commit is contained in:
Sercan Yemen 2017-09-21 14:56:08 +03:00
parent 05575d3f82
commit 9cb8c0c96b
4 changed files with 40 additions and 9 deletions

View File

@ -16,6 +16,7 @@ import { UIModule } from './main/content/ui/ui.module';
import { ComponentsModule } from './main/content/components/components.module'; import { ComponentsModule } from './main/content/components/components.module';
import { FuseSplashScreenService } from './core/services/splash-screen.service'; import { FuseSplashScreenService } from './core/services/splash-screen.service';
import { FuseConfigService } from './core/services/config.service'; import { FuseConfigService } from './core/services/config.service';
import { FuseNavigationService } from './core/components/navigation/navigation.service';
import { ComponentsThirdPartyModule } from './main/content/components-third-party/components-third-party.module'; import { ComponentsThirdPartyModule } from './main/content/components-third-party/components-third-party.module';
import { ServicesModule } from './main/content/services/services.module'; import { ServicesModule } from './main/content/services/services.module';
@ -80,7 +81,8 @@ const appRoutes: Routes = [
], ],
providers : [ providers : [
FuseSplashScreenService, FuseSplashScreenService,
FuseConfigService FuseConfigService,
FuseNavigationService
], ],
bootstrap : [ bootstrap : [
AppComponent AppComponent

View File

@ -1,5 +1,6 @@
import { Component, Input, ViewEncapsulation } from '@angular/core'; import { Component, Input, OnDestroy, ViewEncapsulation } from '@angular/core';
import { FuseNavigationService } from './navigation.service'; import { FuseNavigationService } from './navigation.service';
import { Subscription } from 'rxjs/Subscription';
@Component({ @Component({
selector : 'fuse-navigation', selector : 'fuse-navigation',
@ -7,15 +8,27 @@ import { FuseNavigationService } from './navigation.service';
styleUrls : ['./navigation.component.scss'], styleUrls : ['./navigation.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })
export class FuseNavigationComponent export class FuseNavigationComponent implements OnDestroy
{ {
navigationModel: any[]; navigationModel: any[];
navigationModelChangeSubscription: Subscription;
@Input('layout') layout = 'vertical'; @Input('layout') layout = 'vertical';
constructor(private navigationService: FuseNavigationService) constructor(private fuseNavigationService: FuseNavigationService)
{ {
this.navigationModel = navigationService.getNavigationModel(); this.navigationModelChangeSubscription =
this.fuseNavigationService.onNavigationModelChange
.subscribe((navigationModel) => {
console.warn(navigationModel);
this.navigationModel = navigationModel;
});
}
ngOnDestroy()
{
console.warn('destroyed');
this.navigationModelChangeSubscription.unsubscribe();
} }
} }

View File

@ -1,16 +1,19 @@
import { EventEmitter, Injectable } from '@angular/core'; import { EventEmitter, Injectable } from '@angular/core';
import { NavigationModel } from '../../../navigation.model'; import { NavigationModel } from '../../../navigation.model';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
@Injectable() @Injectable()
export class FuseNavigationService export class FuseNavigationService
{ {
onNavCollapseToggled = new EventEmitter<any>(); onNavCollapseToggled = new EventEmitter<any>();
onNavigationModelChange: BehaviorSubject<any> = new BehaviorSubject({});
navigationModel: NavigationModel; navigationModel: NavigationModel;
flatNavigation: any[] = []; flatNavigation: any[] = [];
constructor() constructor()
{ {
this.navigationModel = new NavigationModel(); this.navigationModel = new NavigationModel();
this.onNavigationModelChange.next(this.navigationModel.model);
} }
/** /**
@ -22,6 +25,21 @@ export class FuseNavigationService
return this.navigationModel.model; return this.navigationModel.model;
} }
/**
* Set the navigation model
* @param model
*/
setNavigationModel(model)
{
// console.log(model);
this.navigationModel = model;
console.log(this.navigationModel);
this.onNavigationModelChange.next(this.navigationModel.model);
}
/** /**
* Get flattened navigation array * Get flattened navigation array
* @param navigationItems * @param navigationItems
@ -41,7 +59,7 @@ export class FuseNavigationService
continue; continue;
} }
if ( navItem.type === 'nav-item' ) if ( navItem.type === 'item' )
{ {
this.flatNavigation.push({ this.flatNavigation.push({
title: navItem.title, title: navItem.title,
@ -53,7 +71,7 @@ export class FuseNavigationService
continue; continue;
} }
if ( navItem.type === 'nav-collapse' ) if ( navItem.type === 'collapse' || navItem.type === 'group' )
{ {
this.getFlatNavigation(navItem.children); this.getFlatNavigation(navItem.children);
} }

View File

@ -12,7 +12,6 @@ import { FuseMdSidenavHelperDirective, FuseMdSidenavTogglerDirective } from '../
import { FusePipesModule } from '../pipes/pipes.module'; import { FusePipesModule } from '../pipes/pipes.module';
import { FuseConfirmDialogComponent } from '../components/confirm-dialog/confirm-dialog.component'; import { FuseConfirmDialogComponent } from '../components/confirm-dialog/confirm-dialog.component';
import { FuseCountdownComponent } from '../components/countdown/countdown.component'; import { FuseCountdownComponent } from '../components/countdown/countdown.component';
import { FuseNavigationService } from '../components/navigation/navigation.service';
import { FuseMatchMedia } from '../services/match-media.service'; import { FuseMatchMedia } from '../services/match-media.service';
import { FuseNavbarVerticalService } from '../../main/navbar/vertical/navbar-vertical.service'; import { FuseNavbarVerticalService } from '../../main/navbar/vertical/navbar-vertical.service';
import { FuseMdSidenavHelperService } from '../directives/md-sidenav-helper/md-sidenav-helper.service'; import { FuseMdSidenavHelperService } from '../directives/md-sidenav-helper/md-sidenav-helper.service';
@ -70,7 +69,6 @@ import { CookieService } from 'ngx-cookie-service';
], ],
providers : [ providers : [
CookieService, CookieService,
FuseNavigationService,
FuseMatchMedia, FuseMatchMedia,
FuseNavbarVerticalService, FuseNavbarVerticalService,
FuseMdSidenavHelperService FuseMdSidenavHelperService