角4孩子路由

Question

我試圖爲孩子寫路由。我遇到的問題是在不正確的路徑中插入瀏覽器的url欄。在代碼下面。

router.module

const routes: Routes = [ 

    {path: 'menu', component: MenuComponent, canActivate: [AuthGuard], 
    children: [ 
     { path: 'upload', component: DrawingUploadComponent }, 
     { path: 'account', component: AccountComponent }, 
     { path: 'projects', component: ProjectListComponent } 
    ]} 
]; 

@NgModule({ 
    imports: [RouterModule.forChild(routes)], 
    exports: [RouterModule] 
}) 

export class MenuRoutingModule {} 

menu.component

<nav> 
    <a routerLink="/projects" routerLinkActive="active">Projects</a> 
    <a routerLink="/upload" routerLinkActive="active">Upload</a> 
    <a routerLink="/account" routerLinkActive="active">Account</a> 
</nav> 
MENU COMPONENT 
<router-outlet></router-outlet> 

父組件：

const routes: Routes = [ 
    {path: 'login', component: LoginComponent}, 
    {path: 'register', component: RegistrationComponent}, 
    {path: "", redirectTo: "login", pathMatch: "full"}, 
    {path: 'menu', component: MenuComponent, canActivate: [AuthGuard]} 
]; 

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

export class AppRoutingModule { 
} 

因此，當顯示"/menu"菜單組件下的IM的問題是，現在當我點擊任何鏈接，例如

<a routerLink="/upload" routerLinkActive="active">Upload</a> 

即時通訊控制檯錯誤 無法匹配任何路由。網址細分：'上傳' 錯誤：無法匹配任何路線。 URL段：「上傳」

，但是當我想通過在瀏覽器欄手型的路線「/菜單/上傳」我得到正確的結果

Answer 1

當你的路線與/開始，那是指你的應用的根源。您需要將其刪除，否則請使用完整路徑routerLink="/menu/upload"。