从子outlet angular导航到root？

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中有一个按钮，我希望它可以导航到登录页面，因为它是根用户，但我无法通过仪表板组件？？

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

Answer 1

回复：

因为这是不可能的，因为我在UserComponent里面，它是DashboardComenent的子插座，所以点击发生在一个子插座里面。

这应该是可能的。我一直都在这么做。

只需确保指定路径中的斜杠，这样它就不是相对于其当前位置。

所以就像这样：

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

Answer 2

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

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