我想把我的一个懒惰加载模块转换成Eager 加载模块.我在app-routing.module.ts中有这样的代码:

const accountModule = () => import('./account/account.module').then(x => x.AccountModule);
const adminModule = () => import('./admin/admin.module').then(x => x.AdminModule);
const profileModule = () => import('./profile/profile.module').then(x => x.ProfileModule);
const scheduleModule = () => import('./schedule/schedule-routing.module').then(x => x.ScheduleRoutingModule);


const routes: Routes = [
    { path: '', component: HomeComponent, canActivate: [AuthGuard] },
    { path: 'account', loadChildren: accountModule },
    { path: 'profile', loadChildren: profileModule, canActivate: [AuthGuard] },
    { path: 'admin', loadChildren: adminModule, canActivate: [AuthGuard], data: { roles: [Role.Admin] } },
    { path: 'schedule', loadChildren: scheduleModule },
    { path: 'report', component: RaportForDateComponent },
    { path: 'floating', component: FloatingSchedulesComponent },

    // otherwise redirect to home
    { path: '**', redirectTo: '' }
];

我想把account转换成Eager 加载的模块.这是我的account-routing.module模块:

const routes: Routes = [
    {
        path: '', component: LayoutComponent,
        children: [
            { path: 'login', component: LoginComponent },
            { path: 'register', component: RegisterComponent },
            { path: 'verify-email', component: VerifyEmailComponent },
            { path: 'forgot-password', component: ForgotPasswordComponent },
            { path: 'reset-password', component: ResetPasswordComponent }
        ]
    }
];

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

我需要在我的app-routing.module.ts Routes中进行哪些更改才能立即加载app-routing.module.ts模块?

推荐答案

您需要直接导入AccountModule

app.module.ts

@NgModule({
  imports: [AccountModule, AppRoutingModule],
  ...

并更新AccountRoutingModule中的根路径.

account-routing.module.ts

{
    path: 'account', component: LayoutComponent,
           ^^^^^^^^
    children: [
        { path: 'login', component: LoginComponent },

最后,当然,不要忘记删除懒惰的部分,

app-routing.module.ts

{ path: 'account', loadChildren: accountModule },

Javascript相关问答推荐

将数据从strapi提取到next.js,但响应延迟API URL

使用useup时,React-Redux无法找到Redux上下文值

单击子元素时关闭父元素(JS)

togglePopover()不打开但不关闭原生HTML popover'

无法在nextjs应用程序中通过id从mongoDB删除'

Angular material 拖放堆叠的牌副,悬停时自动展开&

在nextjs服务器端api调用中传递认证凭证

将本机导航路由react 到导航栏中未列出的屏幕?

手机上的渲染错误文本必须在文本组件中渲染,但在浏览器上没有问题<><>

当输入字段无效时,我的应用程序不会返回错误

Angular 形式,从DOM中删除不会删除指定索引处的内容,但会删除最后一项

获取';无法解决导入和导入";slick-carousel/slick/slick-theme.css";';错误

如何防止ionic 输入中的特殊字符.?

令牌JWT未过期

无法读取未定义的属性(正在读取合并)-react RTK

警告框不显示包含HTML输入字段的总和

Socket.IO在刷新页面时执行函数两次

如何在不将整个文件加载到内存的情况下,在Node.js中实现Unix粘贴命令?

与find()方法一起使用时,Mongoose中的$or运算符没有提供所有必需的数据

已在EventListener中更新/更改异步的React.js状态对象,但不会导致组件重新呈现