angular2 routing - Angular 2/4 subrouting, nested router-outlets -


i have angular 4 app angular material tabs, , trying use tabbed subrouting.

i have defined routes in main routing file:

... { path: 'wall', component: wallhandlercomponent, canactivate: [loggedguard], children: [     { path: '', redirectto: 'recent', outlet: 'walloutlet' },     { path: 'recent', component: recenteventscomponent, outlet: 'walloutlet' },     { path: 'ranking', component: rankinguserscomponent, outlet: 'walloutlet' } ] }, ... 

i load wallhandlercomponent in main <router-outlet> no problem.

now, inside wall-handler.component.html file have secondary/named <router-outlet>:

... <nav md-tab-nav-bar>     <a md-tab-link         *ngfor="let link of wallnavlinks"         [routerlink]="link.path"         routerlinkactive #rla="routerlinkactive"         [active]="rla.isactive">         {{link.label}}     </a> </nav>  <router-outlet name="walloutlet"></router-outlet> ... 

and in wall-handler.component.ts, define wallnavlinks follows:

... wallnavlinks(): { label: string, path: any[] }[] {     return [         { label: 'recent', path: [{ outlets: { walloutlet: 'recent' } }] },         { label: 'ranking', path: [{ outlets: { walloutlet: 'ranking' } }] }     ]; } ... 

however, when load /wall, instead of loading inside secondary (walloutlet) outlet, browser goes crazy , hangs.

what doing wrong?


Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -