Angular2路由與輔助出口

我有一個目錄結構是這樣的：Angular2路由與輔助出口

my-app 
    |- src 
    |- app 
     |- private 
     |- private.routing 
     |- public 
     |- public.routing 
     app.routing

的private.routing文件：

export const routing: ModuleWithProviders = RouterModule.forChild([ 
    { path: '', component: PrivateComponent, children: [ 
    { path: 'header', component: HeaderComponent, outlet: 'auxheader' }, 
    { path: 'dashboard', component: DashboardComponent } 
    ]}, 
]);

的app.routing文件：

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

export const routes: Routes = [ 
    { path: '', redirectTo: 'public', pathMatch: 'full' }, 
    { path: 'public', loadChildren: 'app/public/public.module#PublicModule' }, 
    { path: 'private', loadChildren: 'app/private/private.module#PrivateModule' } 
]; 

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

從在一個部件公共目錄，我嘗試在成功認證後私下導航到一個組件ication。

如果我使用this.route.navigateByUrl('/private/dashboard');它的工作原理，但使用this.route.navigateByUrl('/private/(dashboard//auxheader:header)');失敗，出現以下錯誤Cannot match any routes: 'private'。

我在哪裏錯了？

來源

2016-09-15 efxzsh

必須更正的URL，

this.route.navigateByUrl('/private/dashboard(auxheader:header)');

希望這有助於！

來源

2016-09-15 15:28:15

它幫助，錯誤的是不一樣的'不能匹配任何路線：「header'' :) – efxzsh

您可以添加您在其中定義'private'路徑路線？ –

我已更新我的帖子。你在說這個？ – efxzsh

如上所述：你的路徑是錯誤的。瀏覽正確的路徑應該是：

/private/(auxheader:account)

來源

2016-09-15 16:23:28 Baumi

它不工作，我想要做的是導航到儀表板並打開一個特定的標題。 – efxzsh

Tham使標題成爲儀表板的一個孩子，並導航到'/ private/dashboard /（auxheader：account）' - 您仍然留在儀表板中，並且'HeaderComponent'將加載到'auxheader'路由器插座中。 – Baumi

Angular2路由與輔助出口

回答

相關問題