Angular lazy load of child module is not working?

Question

I have a child module called branch and I wanted to load it only when I navigate to '/branch' url but am getting below error

ERROR Error: Uncaught (in promise): TypeError: undefined is not a function
TypeError: undefined is not a function
    at Array.map (<anonymous>)
    at webpackAsyncContext ($_lazy_route_resource lazy namespace object:15)

Navigation is used with routerLink as below

<button mat-raised-button color="accent" [routerLink]="['/branch']">View Branches</button>

app-routing-module.ts is:

const routes: Routes = [
  { path: 'branch', loadChildren: './branch/branch.module#BranchModule' },
];

Branch Module is:

@NgModule({
  imports: [
    CommonModule,

    RouterModule.forChild([{
        path: '', component: BranchComponent,
      },
      {
        path: 'view/:id', component: ViewBranchComponent
      }
    ])
  ],
  declarations: [BranchComponent, ViewBranchComponent],
  exports: [BranchComponent, ViewBranchComponent, RouterModule]
})
export class BranchModule { }

Please can someone advise what went wrong here

Answer 1

Seems you have importe LazyLoad Module in to your app.module.here, See the related issue rom Github here.