Question

我正在学习Angular 9并在上面尝试新事物。今天，我尝试使用具有name属性的路由器插座，如下面的代码所示。

我的模板：

<router-outlet name='list1'></router-outlet>

我的路由器模块

    import { NgModule } from "@angular/core";
import { Routes, RouterModule } from '@angular/router';
import { DashboardComponent } from './dashboard.component';

const dashboardRoutes: Routes = [
    {
        path: "", component: DashboardComponent, children: [
            { path: "", outlet: "list1", data: { msg: "This is ITEMS LIST test1" }, loadChildren: () => import("../items-list/items-list.module").then(m => m.ItemsListModule) },
        ]
    }
];

@NgModule({
    imports: [RouterModule.forChild(dashboardRoutes)],
    exports: [RouterModule]
})
export class DashboardRoutingModule { }

现在一切正常，但是当我手动重新加载页面时，Angular应用程序崩溃了。它显示了错误：

core.js:6260 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'routes' of undefined
TypeError: Cannot read property 'routes' of undefined
    at getChildConfig (router.js:5910)
    at Recognizer.processSegmentAgainstRoute (router.js:5836)
    at Recognizer.processSegment (router.js:5783)
    at Recognizer.processSegmentGroup (router.js:5754)
    at router.js:5768
    at router.js:1917
    at forEach (router.js:1455)
    at mapChildrenIntoArray (router.js:1910)
    at Recognizer.processChildren (router.js:5763)
    at Recognizer.processSegmentAgainstRoute (router.js:5840)
    at resolvePromise (zone-evergreen.js:798)
    at resolvePromise (zone-evergreen.js:750)
    at zone-evergreen.js:860
    at ZoneDelegate.invokeTask (zone-evergreen.js:399)
    at Object.onInvokeTask (core.js:41640)
    at ZoneDelegate.invokeTask (zone-evergreen.js:398)
    at Zone.runTask (zone-evergreen.js:167)
    at drainMicroTaskQueue (zone-evergreen.js:569)

如果有人可以帮助我，那对我真的很好。

谢谢。

Answer 1

为使其正常工作，您需要使用没有名称的辅助插座。因此，在您的组件中只需使用<router-outlet></router-outlet>，您的路由器模块文件应如下所示：

const dashboardRoutes: Routes = [
    {
        path: "", component: DashboardComponent, loadChildren: () => import("../items-list/items-list.module").then(m => m.ItemsListModule) },
        ]
    }
];

Angular 9错误：TypeError：无法读取未定义的属性“ routes”

1 个答案: