Question

问题是我想从子路径中导航到应用根。

这是我的结构：

export const rootRouterConfig: Routes = [
   { path: '', redirectTo: 'login', pathMatch: 'full' },
   { path: 'login', component: LoginComponent, canActivate: [AuthGuard] },
   { path: 'dashboard', component: DashboardComponent, resolve: { data: UserResolver},
     children: [
        { path: '', redirectTo: 'projects', pathMatch: 'full' },
        { path: 'projects', component: ProjectsComponent, resolve: { data: UserResolver}},
        { path: 'addproject', component: AddprojectComponent, resolve: { data: UserResolver}},
        { path: 'updateproject/:key', component: AddprojectComponent, resolve: { data: UserResolver}},
        { path: 'network', component: NetworkComponent, resolve: { data: UserResolver}},
        { path: 'figures', component: FiguresComponent, resolve: { data: UserResolver}},
        { path: 'user', component: UserComponent,  resolve: { data: UserResolver}}
     ]
   },
   { path: 'forgot', component: ForgotComponent },
];

这是app.compenent.html：

<main>
    <router-outlet></router-outlet>
</main>

这是dashboard.component.ts：

<div class="dashboard-content-wrapper">
   <router-outlet></router-outlet>
</div>

我在UserComponent中有一个按钮，由于它是root用户，所以我希望它可以导航到登录页面，但是我无法通过仪表板组件？

deleteProfile() {
    this.route.navigate(['/'])
}

Answer 1

RE：

因为这是不可能的，因为我位于UserComponent中 DashboardComenent的子级，因此点击发生在儿童插座。

应该有可能。我一直都这样做。

只需确保在路径中指定斜杠，使其与当前位置无关。

是这样的：

this.router.navigate(['/login']);

Answer 2

您需要相对于现有route进行路由。

this.route.navigate([ '../../' ], { relativeTo: this.route })

从子出口角度导航到根？

2 个答案: