我正在开发一个 angular 4 应用程序,我想在 router-outlet 之外加载 login.page.ts
这是我的home.component.html文件
<div class="container">
<top-nav-bar></top-nav-bar>
<lett-nav-bar></lett-nav-bar>
<router-outlet></router-outlet>
</div>
路由配置
const MAINMENU_ROUTES: Routes = [
{ path: 'login', component: LoginComponent },
{ path: '', redirectTo: 'home', pathMatch: 'full'},
{ path: 'home', component: HomeComponent, canActivate: [AuthGuard]}
];
有了这个,我可以在路由器内加载登录页面,但我想在进入路由器导出之前全屏加载登录页面。
最佳答案
如果没有路由器 socket ,您将无法路由到页面。根据您的描述,听起来您需要另一个更高级别的路由器 socket ,比如在 App 组件中。像这样:
<div class="container">
<router-outlet></router-outlet>
</div>
然后您可以将登录页面和主页组件路由到这个路由器导出。
你的路由配置看起来像这样:
{ path: 'login', component: LoginComponent },
{ path: 'home', component: HomeComponent, canActivate: [AuthGuard],
children: [
{ path: 'child1', component: Child1Component },
{ path: 'child2', component: Child2Component }
]
}
然后登录和主页路由将出现在 App 组件的路由器导出中,因此登录页面将全屏显示,没有导航栏。 child1 和 child2 路由将出现在 Home Component 的路由器导出中。
关于javascript - 以 Angular 4 在路由器导出外加载页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44912771/