라우팅 각 2

Question

각 2 (RC-5), enter image description here

app.html

<nav> 
    <a routerLink="/developers" routerLinkActive="active">Developers</a> 
    <a routerLink="/customers" routerLinkActive="active">Customers</a> 
</nav> 
<div class="container"> 
    <div class="row"> 
    <router-outlet></router-outlet> 
    </div> 

및 developer.html
를 사용하여 라우팅에서 라우팅을 수행하는 방법 *** * 코드 **

<a routerLink="/link1">link1</a> 
<a routerLink="/link2" routerLinkActive="active">link2</a> 
<router-outlet></router-outlet> 

이 두 링크 (link1 및 link2)가 main 당신이 outleet

Answer 1

라우터 //developer.html

<a routerLink="/link1">link1</a> 
<a routerLink="/link2" routerLinkActive="active">link2</a> 
<router-outlet name="auxPathName"></router-outlet> 

및 라우팅 구성에

가 auxPathName

포함 번째 노드 라우터 출구 다른 이름을 수득 여기에 라우터 콘센트 노드를 여러 개 추가하는 방법을 설명합니다 :,515,https://stackoverflow.com/a/34642273/896258

---

여기 (Angular2 RC5, 라우터 3 RC1) 한 라우터 출구 노드 만 내 동작 예이다.

HTML 파일

<ul> 
    <li [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact: true}"><a routerLink="events">All Events</a></li> 
    <li [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact: true}"><a routerLink="events/news">News</a></li> 
    <li [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact: true}"><a routerLink="events/family">Family Events</a></li> 
    <li [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact: true}"><a routerLink="events/wedding">Wedding Events</a></li> 
    </ul> 
</div> 

app.routing 파일

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

import { EventsComponent } from './events/events.component'; 
import { EventDetailsComponent } from './eventdetails/eventdetails.component'; 

const appRoutes: Routes = [ 
    { path: 'events', component: EventsComponent }, 
    { path: 'events/:type', component: EventsComponent }, 
    { path: 'events/:id/detail', component: EventDetailsComponent }, 
    { path: '', redirectTo: 'events', pathMatch: 'full' }, 
    // { path: '**', component: PageNotFoundComponent }//TODO: this should redirect to PageNotFound 
]; 

export const appRoutingProviders: any[] = []; 

export const routing = RouterModule.forRoot(appRoutes);