Question

首先-仅供参考，路由模块设置为：

@NgModule({
  imports: [RouterModule.forRoot(ALL_ROUTES)],
  exports: [RouterModule],
  providers: []
})
export class AppRoutingModule {}

将所有路由放入名为“ ALL_ROUTES”的1个数组中，并将该数组传递给AppRoutingModule-导入：[RouterModule.forRoot（ALL_ROUTES）]，工作正常：

export const ALL_ROUTES: Routes = [
  {path: 'route1', component: FirstComponent},
  {path: 'route2', component: SecondComponent},
  {path: 'route3', component: ThirdComponent},
  {path: 'route4', component: FourthComponent}
];

因此，以上代码可以正常工作。但是，如果我们有2个数组，并像这样连接它们：

export const ROUTES1: Routes = [
  {path: 'route1', component: FirstComponent},
  {path: 'route2', component: SecondComponent}
];

export const ROUTES2: Routes = [
  {path: 'route3', component: ThirdComponent},
  {path: 'route4', component: FourthComponent}
];

export const ALL_ROUTES: Routes = ROUTES1.concat(ROUTES2);

我们收到编译错误：

ERROR in Cannot read property 'loadChildren' of undefined

这里已经询问过类似问题，但没有针对此问题的解决方案。有没有可能的解决方案？可能是对发生什么情况的解释？

Answer 1

对于那些正在寻找有答案的帖子的人-正如Danil上面所建议的那样，这似乎有效。如果有任何潜在问题，请发表评论。

export const ALL_ROUTES: Routes =
    [
      ...ROUTES1,
      ...ROUTES2
    ];

Answer 2

您也可以尝试。

const supportedGames: Route[] = [
    {
        path: "pubg",
        component: LoginComponent
    }
];

const routes: Routes = [
    {
        path: "",
        component: LoginComponent,
    },
    {
        path: "login",
        component: LoginComponent,
    },
    {
        path: "main",
        component: MainViewComponent,
        children: ([
            {
                path: "game-list",
                component: GameListComponent,
            }
        ] as Route[]).concat(supportedGames)
    },
    {
        path: "**",
        redirectTo: ""
    }
];

Angular 7路由concat导致编译错误

2 个答案: