Routeur-sortie multiple angulaire 2

Je veux afficher différentes vues par enfant routes. Par Exemple je veux que mon modèle pour contenir plusieurs routeur-prise

Version: @angular/router": "3.0.0-alpha.7"

<router-outlet></router-outlet>
<router-outlet name="route1"></router-outlet>
<router-outlet name="route2"></router-outlet>

Dans mon routeur je veux spécifier le nom du routeur.

Comme je l'ai vu dans une question, la solution pour cela est de spécifier AuxRoute, mais AuxRoute n'existe pas dans cette version.

{path: '/',        component: HomeComponent, as: 'Home'},
new AuxRoute({path: '/route1', component: Route1Component, as: 'Route1'}),
new AuxRoute({path: '/route2', component: Route2Component, as: 'Route2'})

Tout sur angulaire 2 site officiel, j'ai trouvé qu'il est possible d'avoir plusieurs routeur, mais je ne peux pas trouver n'importe quelle ressource.

https://angular.io/docs/ts/latest/guide/router.html

A template may hold exactly one unnamed <router-outlet>. The router supports multiple named outlets, a feature we'll cover in future.

source d'informationauteur Prince

  1. 29

    Version actuelle multiples nommé router-outlet (pour angular2 RC.6^) ressemble à ceci:

    De configuration du routeur

    const appRoutes: Routes = [{   
    path: 'home',
      component: HomeComponent,
      children: [
        { path: '', component: LayoutComponent },
        { path: 'page1', component: Page1Component, outlet: 'route1' },
        { path: 'page2', component: Page2Component, outlet: 'route2' },
        { path: 'page3', component: Page3Component, outlet: 'route3' }
      ]
    }, {
      path: 'articles',
      component: ArticlesComponent,
      children: [
        { path: '', component: LayoutComponent },
        { path: 'article1', component: Article1Component, outlet: 'route1' },
        { path: 'article2', component: Article2Component, outlet: 'route2' }
      ]
    },  { 
      path: '', 
      redirectTo: '/home',
      pathMatch: 'full'
   }
];

    Modèle dans Maison composant:

    <router-outlet></router-outlet>
<router-outlet name="route1"></router-outlet>
<router-outlet name="route2"></router-outlet>
<router-outlet name="route3"></router-outlet>

    Et un de navigation exemple de composant racine:

    constructor(router: Router) {
  router.navigateByUrl('/home/(route1:page1//route2:page2//route3:page3)');
}

    Autre façon:

    <a [routerLink]="['/home', { outlets: {'route1':['page1'],'route2': ['page2'] }}]"></a>

    Ici en direct Plunker Exemple

    Voir aussi