Angular2路由器不替换组件

Question

当我使用router.navigate ['some-route']时，新路由的组件将添加到旧路由的组件之上，而不是替换它：

当前路线是登录页面：

登录后，我通过以下方式导航到我的主页：

this.router.navigate(['/form-builder']);

，但它的组件只是添加到登录组件的顶部而不替换它：

根组件模板：

<router-outlet></router-outlet>

路由配置：

const routes: Routes = [
    { path: '', redirectTo: 'form-builder', pathMatch: 'full' },
    { path: 'form-builder', component: FormEditorComponent, canActivate: [AuthGuard] },
    { path: 'login', component: LoginComponent },
    { path: 'signup', component: SignupComponent },
];

我做错了什么？

Answer 1

当您看到在当前组件的TOP上添加组件时，通常意味着抛出了一些错误。检查您的开发控制台，并告诉我们您在导航时是否遇到一些错误。如果有的话，每当你在其他地方导航时，它应该继续堆叠在彼此之上。

不，我不确定为什么，或者Angular是否意味着以这种方式发生，但确实如此。只是从经验来讲。