Pesquisa de site

typescript - concatenar rotas no Angular 7 resulta em erro de compilação


Primeiro - Para sua informação, o módulo de roteamento está configurado para:

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

Colocando todas as rotas em um array chamado: 'ALL_ROUTES' e passando o array para o AppRoutingModule - imports: [RouterModule.forRoot(ALL_ROUTES)], funciona bem:

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

Então, o código acima funciona bem. No entanto, se tivermos 2 arrays e os concatenarmos assim:

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);

recebemos um erro de compilação:

ERROR in Cannot read property 'loadChildren' of undefined

Algumas perguntas semelhantes foram feitas aqui, mas não há solução para este problema. Existe uma possível solução? Talvez uma explicação do que está acontecendo?

Resposta #1

Para aqueles que estão procurando por posts com respostas - como sugerido acima por Danil, isso parece estar funcionando. Por favor, poste comentários se houver algum problema potencial.

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

Resposta #2

Você também pode tentar isso.

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: ""
    }
];

Artigos relacionados