Nested lazy loaded routes

app-routing.module.ts

export const routes: Routes = [
  {
    path: '',
    component: AppComponent,
    children: [
      { path: 'home', component: DummyComponent },

      { path: '', canLoad: [AuthGuard], loadChildren: './viewer/viewer.module#ViewerModule' },
      // { path: '_', canLoad: [AuthGuard], loadChildren: './editor/editor.module#EditorModule' },
      { path: '**', redirectTo: 'home' },
    ]
  },
];
@NgModule({
  imports: [
    RouterModule.forRoot(routes),
  ],
  exports: [RouterModule],
})
export class AppRoutingModule { }

editor__editor-routing.module.ts

const routes: Routes = [
  {
    path: '',
    children: [
      { path: '', component: EditorComponent },
      { path: ':model', component: EditorComponent },
    ],
  },
];

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

editor__editor.module.ts

@NgModule({
  declarations: [
    EditorComponent,
  ],
  imports: [
    ReactiveFormsModule,
    SharedModule,
    EditorRoutingModule,
  ],
  providers: [
  ],
})
export class EditorModule { }

viewer__viewer-routing.module.ts

const routes: Routes = [
  {
    path: '',
    canActivate: [AuthGuard],
    component: ViewerComponent,
    children: [
      { path: '_', loadChildren: './editor/editor.module#EditorModule' },
      { path: '', component: DummyComponent },
    ]
  },
];
@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule],
})
export class ViewerRoutingModule { }

viewer__viewer.module.ts

@NgModule({
  declarations: [
    ViewerComponent,
  ],
  imports: [
    ViewerRoutingModule,
    ReactiveFormsModule,
    SharedModule,
  ],
  providers: [ ],
})
export class ViewerModule { }