Question

我具有这样的路径结构：staff4.T.plot(kind='bar',title="Gender Pay Gap Analysis")，事件和图形是具有各自的路由表的独立模块，例如：

/events/100/drawing/200

和

// Event ID routes
const routes: Routes = [
{
    path: ':eventID', 
    data: { breadcrumb: 'Drawings & Results' },
    component: EventComponent,

    children: [
        {
            path: 'drawing', 
            loadChildren: () => import('@app/modules/event-drawing/event-drawing.module').then(mod => mod.EventDrawingModule)
        }
    ]
}

有一个面包屑可以显示当前路径，并且路由似乎有效。但是无论如何都加载了const routes: Routes = [ { path: ':drawingID', data: { breadcrumb: 'Drawing' }, component: EventDrawingComponent }, ];，但没有加载EventComponent。

我还尝试过从以下位置删除EventDrawingComponent：

EventComponent

现在// Event ID routes const routes: Routes = [ { path: ':eventID', data: { breadcrumb: 'Drawings & Results' }, children: [ { path: 'drawing', loadChildren: () => import('@app/modules/event-drawing/event-drawing.module').then(mod => mod.EventDrawingModule) } ] }已加载，但是当然EventDrawingComponent将不再起作用。请您告诉我代码有什么问题吗？

Answer 1

确保父模板中的某个位置有<router-outlet></router-outlet>。 Angular路由器在此处渲染已加载的组件。没有它，您的组件类将被实例化，但无法呈现。

此外，请确保已将RouterModule添加到父模块的imports数组中。

角路由器似乎正常工作，但未加载组件

1 个答案: