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 { FuseSplashScreenService } from './core/services/splash-screen.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 { ServicesModule } from './main/content/services/services.module';
@ -80,7 +81,8 @@ const appRoutes: Routes = [
],
providers : [
FuseSplashScreenService,
FuseConfigService
FuseConfigService,
FuseNavigationService
],
bootstrap : [
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 { Subscription } from 'rxjs/Subscription';
@Component({
selector : 'fuse-navigation',
@ -7,15 +8,27 @@ import { FuseNavigationService } from './navigation.service';
styleUrls : ['./navigation.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class FuseNavigationComponent
export class FuseNavigationComponent implements OnDestroy
{
navigationModel: any[];
navigationModelChangeSubscription: Subscription;
@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 { NavigationModel } from '../../../navigation.model';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
@Injectable()
export class FuseNavigationService
{
onNavCollapseToggled = new EventEmitter<any>();
onNavigationModelChange: BehaviorSubject<any> = new BehaviorSubject({});
navigationModel: NavigationModel;
flatNavigation: any[] = [];
constructor()
{
this.navigationModel = new NavigationModel();
this.onNavigationModelChange.next(this.navigationModel.model);
}
/**
@ -22,6 +25,21 @@ export class FuseNavigationService
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
* @param navigationItems
@ -41,7 +59,7 @@ export class FuseNavigationService
continue;
}
if ( navItem.type === 'nav-item' )
if ( navItem.type === 'item' )
{
this.flatNavigation.push({
title: navItem.title,
@ -53,7 +71,7 @@ export class FuseNavigationService
continue;
}
if ( navItem.type === 'nav-collapse' )
if ( navItem.type === 'collapse' || navItem.type === 'group' )
{
this.getFlatNavigation(navItem.children);
}

View File

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