Question

我有这个项目：

主要路线：

 const routes: Route[] = [
     {
         path: 'login',
         loadChildren: 'app/login/login.module#LoginModule'
     },
     {
         path: 'dashboard',
         loadChildren: 'app/dashboard/dashboard.module#DashboardModule',
         // canActivate: [AccessGuard]
     },
     {
         path: '',
         loadChildren: 'app/login/login.module#LoginModule'
     },
     {
         path: '**',
         loadChildren: 'errors/404/404-error.module#Error404Module'
     }, ];

仪表板模块：

@NgModule({
    declarations: [
        DashboardComponent,
    ],
    imports: [
        CommonModule,
        AppNavbarModule,
        RouterModule.forChild([
            {
                path: '',
                redirectTo: ''
            }
        ])
    ]
})
export class DashboardModule { }

AppNavbarModule

@NgModule({
    declarations: [
        AppNavbarComponent,
    ],
    imports: [
        CommonModule
    ],
    exports: [
        AppNavbarComponent
    ],
    providers: [
        AccessGuard
    ]
})
export class AppNavbarModule { }

Dashboard.html

<app-navbar #navbarComponent></app-navbar>

Navbar组件

@Component({
    selector: 'app-navbar',
    templateUrl: './navbar.component.html',
    styleUrls: ['./navbar.component.scss']
})

-- implementation is useless

我在加载到localhost：4200 /仪表板时只显示空白页面什么时候它应该在我的navbar html文件上显示内容。我错过了什么？

Answer 1

您正在告诉渲染空页面的路线，而不是特定组件。
你应该交换这部分：

RouterModule.forChild([{
   path: '',
   redirectTo: ''
}])

为此：

RouterModule.forChild([{
   path: '',
   component: AppNavbarComponent
}])

角度嵌套路由

1 个答案: