mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-01-10 04:25:08 +00:00
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:
parent
05575d3f82
commit
9cb8c0c96b
|
@ -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
|
||||||
|
|
|
@ -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();
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -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);
|
||||||
}
|
}
|
||||||
|
|
|
@ -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
|
||||||
|
|
Loading…
Reference in New Issue
Block a user