Angular 2 auxiliary router routes not working on redirectTo

Question

I recently started a new project based on angular 2.0.0 in combination with angular Router (V3.0.0). Thus, I have problems with auxiliary routes.

I want to split my application into different views that appear in each state, such as navigation bar, main content, footer, etc. Thus, when the user interacts with the site, only the part of the page that needs to be changed (fe content), and all other views remain as they are. Therefore, I wanted to use the helper function of routers, as discussed in this conversation:

Angular Router Talk @ AC2015

I installed my files as follows:

app.html

<router-outlet name="navigation"></router-outlet>

<main>
    <router-outlet></router-outlet>
</main>

<router-outlet name="footer"></router-outlet>

app.routes.ts

import {Routes} from '@angular/router';

export const rootRouterConfig: Routes = [
  {path: '', redirectTo: 'start(navigation:/navigation)', pathMatch: 'full'}
];

start.routes.ts

import {Routes} from '@angular/router';
import {StartContentComponent} from './startContent/startContent.component';
import {StartNavigationComponent} from "./startNavigation/startNavigation.component";  

export const startRouterConfig: Routes = [
    {path: 'start', component:  StartContentComponent},
    {path: 'navigation', component: StartNavigationComponent, outlet: 'navigation'}
];

:

http://localhost:3000/#/start(navigation:/navigation)

URL- . app.routes.ts , http://localhost:3000/#/:

( ): : : ''

angular 2 , , . , , .

- , , ?

, ?

Ui-router?

Answer 1

, - , , , " " .

:

export const RedirectionIncludingAuxRoutes: RouterConfig = [
    {
        path: 'redirect-me',
        redirectTo: 'redirected-with-aux'
    },
    {
        path: 'redirected-with-aux',
        children: [
            {
                path: '',
                component: PrimaryComponent
            },
            {
                path: '',
                component: SecondaryComponent,
                outlet: 'auxiliary'
            }
        ]
    }
]

Answer 2

, .
,

redirectTo: 'start(navigation:/navigation)'
to
redirectTo: 'start/(navigation:navigation)'

{path: 'start', component:  StartContentComponent},
{path: 'navigation', component: StartNavigationComponent, outlet: 'navigation'}
to
{path: 'start', component:  StartContentComponent,
   children: [
      {path: 'navigation', component: StartNavigationComponent, outlet: 'navigation'}
]},

:
http://blog.angular-university.io/angular2-router/

Answer 3

. . rootRouterConfig .

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

@NgModule({
  imports: [RouterModule.forRoot(rootRouterConfig)],
  exports: [RouterModule],
})

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

export const routing: ModuleWithProviders =RouterModule.forRoot(rootRouterConfig);

Let me know which one works for you.