我使用“loadChildren”来解决此问题。这段代码在app.routing.module.ts
const routes: Routes = [
{ path: '', redirectTo: '/dashboard', pathMatch: 'full' },
{ path: 'dashboard', loadChildren:() => DashboardModule, canActivate: [AuthGuard]},
{ path: 'login', component: LoginComponent}
]
这段代码在仪表板routing.module.ts
const dashboardRoutes: Routes = [
{
path: '',
component: DashboardComponent,
children : [
{
path: '',
children:[
{ path: 'user', component: UserComponent, canActivate: [DashboardGuard] },
{ path: 'user-crud', component: UserCrudComponent, canActivate: [DashboardGuard] },
{ path: 'user-crud/:id', component: UserCrudComponent, canActivate: [DashboardGuard] }
]
},
此代码app.component.ts,autorization,装载dashboard.module后并在此组件中显示<router-outlet></router-outlet>
。
import { Component, OnInit} from '@angular/core';
@Component({
selector: 'app-root',
template: '<router-outlet></router-outlet>'
})
export class AppComponent implements OnInit {
constructor(){}
ngOnInit() {}
}
此代码在content.component.ts中,此组件中的所有页面均显示。
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-content',
template: '<router-outlet></router-outlet>'
})
export class ContentComponent implements OnInit {
constructor() {}
ngOnInit() {}
}
如果可能,你能澄清一下吗?你想做什么 ? 如果我理解正确,如果您没有授权,您正在使用'* ngIf'来显示/隐藏组件,但是您想要做比这更好的事情? 你应该使用路由器'Guard'。看看这篇文章的回答:http://stackoverflow.com/questions/39183404/angular-2-route-restriction-with-angularfire-2-auth/39186038#39186038 –
@AlexBeugnet我使用一个路由器卫队,但它''没有解决我的问题 – aimprogman