Angular

Question

我正在开发带有 Angular 8+ 应用程序的 NativeScript。

我有 2 个功能模块：身份验证和身份验证。现在我所有的路由都在一个主路由文件中：app-routing.module.ts

如何将我的路由分离到各自的模块中并保持一切正常？

例如

const routes: Routes = [
    { path: "", redirectTo: "/landing-page", pathMatch: "full" },
    { path: "landing-page", component: LandingPageComponent },
    { path: "register-client-code", component: RegisterClientCodeComponent },
    { path: "register-via-sso", component: RegisterViaSsoComponent },
    { path: "sign-up-page", component: SignUpPageComponent },
    { path: "home-page", component: HomePageComponent },
    { path: "activities", component: ActivitiesComponent },
    { path: "flexi-balance", component: FlexiBalanceComponent },
    { path: "balance-details", component: BalanceDetailsComponent }
];

@NgModule({
    imports: [NativeScriptRouterModule.forRoot(routes)],
    exports: [NativeScriptRouterModule]
})
export class AppRoutingModule { }

我希望我的主页和功能页面在经过身份验证的模块路由器中，而其他页面在身份验证模块中。

Answer 1

通过在您的父路由文件中使用 loadChildren 导入功能模块（带有相应的路由）：

{
    path: 'authenticated',
    loadChildren: () =>
    import('./authenticated/authenticated.module').then(m => m.AuthenticatedModule),
}

AuthenticatedModule 内部导入 AuthenticatedRoutingModule

编辑：查看 Angular 文档（延迟加载）以获取更多信息：https://angular.io/guide/router#lazy-loading-route-configuration

Angular - 如何将路由分成模块？

Angular - how to separate the routes into modules?

routing

routes

nativescript