Angular2 ổ cắm bộ định tuyến lồng nhau

Question

Tôi đang phát xung quanh với Angular 2 và tôi đang gặp một số sự cố với bộ định tuyến. Tôi muốn có bộ định tuyến thứ hai bên trong bộ định tuyến chính.

Bên trong router-cửa hàng đầu tiên, tôi chuyển hướng đến trang chủ, nơi mà tôi có thứ hai router-ổ cắm:

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

Đây là app.routing của tôi mà không nhập khẩu.

const appRoutes: Routes = [ 
    { path: '', component: HomeComponent }, 
    { path: 'login', component: LoginComponent}, 
    { path: 'days', component: DaysComponent, outlet: 'main'} 
]; 

export const appRoutingProviders: any[] = [ 

]; 

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

Trên HomeComponent ngOnInit Tôi có điều này

this.router.navigateByUrl('/(main:days)'); 

Nhưng điều này treo web với các lỗi sau:

của router (trong lời hứa): Lỗi: Không thể tìm ra chính ổ cắm để nạp 'DaysComponent'

Làm cách nào để có bộ định tuyến thứ hai bên trong máy chính?

Cảm ơn bạn.

Answer 1

Hãy thử với cấu hình tuyến đường này:

const appRoutes: Routes = [ 
    { path: '', component: HomeComponent }, 
    { path: 'login', component: LoginComponent}, 

    { 
     path: 'wrap', 
     component: HomeComponent, 
     children: [ 
      { 
      path: 'days', 
      component: DaysComponent, 
      outlet: 'main' 
      } 
     ] 
    } 
]; 

và URL này:

this.router.navigate(['/wrap', { outlets: { main: 'days' } }]); 

hoặc (tương đương)

this.router.navigateByUrl('/wrap/(aux:aux)');