Angular10 中的延迟加载路由

Question

如果有人尝试编写这样的延迟加载并获得成功，请提供帮助，我在这里遇到了问题。 我创建了一个 angular 应用程序并尝试使用延迟加载，但它对我没有帮助。

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {EmployeeComponent} from './employee/employee.component';
import {RegistrationComponent} from './registration/registration.component';

const routes: Routes = [
                        {
                            path:'',
                            component:EmployeeComponent
                        },
                        {
                            path:'employee/registration',
                            component: RegistrationComponent
                        }
                        ]

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

这是我的代码，我绑定到应用程序中的路由，例如：

const routes: Routes = [
    {
        path: '',
        component: LayoutComponent,
        children: [
            {
                path: '',
                component: EmployeeComponent
            },
            {
                path: 'employee',
                loadChildren: () => import('./hr/hr.module').then(m => m.HrModule)
            }
]

我刚刚创建了一个名为 hr 的子文件夹，在该 hr 中我添加了另外两个文件夹，例如员工和注册，但在 hr-routing-module.ts 文件中，我只是在一个代码和 hr-module 文件中添加了与相同的组件好吧，在 app-routing.ts 文件中，我刚刚添加了以下代码。 那么它是正确的连接方式还是我必须单独声明所有组件？

Answer 1

在应用程序组件中

在布局组件中

在 hrModule 导入中：[CommonModule, RouterModule.forChild(routes)],