Angular 2 Admin navigation/routes separate from Client side navigation/routes

Question

I know Angular 2 likes to use a single navigation to switch between pages. My issue is that the admin navigation is completely different than client facing navigation.

M

Answer 1

You can have routing set up in multiple places, including specialised routing modules.

You can then import multiple routing modules in another root module for example.

Please refer to the documentation which gives you loads of examples with all the possible configurations: angular routing module

Edit

From the angular docs, here is how one would set up an angular routing module for certain paths.

import { NgModule }             from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

import { HeroListComponent }    from './hero-list.component';
import { HeroDetailComponent }  from './hero-detail.component';

const heroesRoutes: Routes = [
  { path: 'heroes',  component: HeroListComponent },
  { path: 'hero/:id', component: HeroDetailComponent }
];

@NgModule({
  imports: [
    RouterModule.forChild(heroesRoutes)
  ],
  exports: [
    RouterModule
  ]
})
export class HeroRoutingModule { }

And this is how this is imported in another module:

import { NgModule }       from '@angular/core';
import { CommonModule }   from '@angular/common';
import { FormsModule }    from '@angular/forms';

import { HeroListComponent }    from './hero-list.component';
import { HeroDetailComponent }  from './hero-detail.component';

import { HeroService } from './hero.service';

import { HeroRoutingModule } from './heroes-routing.module';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    HeroRoutingModule
  ],
  declarations: [
    HeroListComponent,
    HeroDetailComponent
  ],
  providers: [ HeroService ]
})
export class HeroesModule {}

You can create several routing modules and import them in other modules as you wish.