代替Angular 2/4中的根组件的登录表单

我的应用程序中的所有内部页面都有页眉、页脚和工具栏组件

这是我的根组件：

@Component({
  selector: 'app-root',
  template: `
    <app-header></app-header>
    <main id="content">
      <app-toolbar></app-toolbar>
      <router-outlet></router-outlet>
    </main>
    <app-footer></app-footer>`,
}) 
export class AppComponent { ... }

---

显示登录表单时，将显示页眉、页脚和工具栏。我不希望它们在登录页面上可见。如果可能，我希望我的

LoginComponent

替换登录页面上的

AppComponent

。

我正在使用类似的应用程序。我所做的是使用路径路由登录页面：“。登录路由到管理组件，该组件作为具有页眉、页脚和侧边栏的父组件。此管理组件有一个带有路由器出口的主视图，我在其中路由所有子组件，路由类似于此管理/form1、管理/form2等。

可能重复？可能重复*登录按钮路由到管理组件。

const routes: Routes = [
  { path: '', component: HomeComponent, canActivate: [LoginGuard]},
  { path: 'login', component: LoginComponent},
    ...
];