角度延迟加载从模块1到模块2，但不是相反，为什么？

Question

我有一个Angular项目。在我的一个模块中，我有一个路由，以下一个方式配置：

const routes: Routes = [{
  path: '',
  component: PagesComponent,
  children: [
    {
      path: 'dashboard',
      loadChildren: 'app/pages/dashboard/dashboard.module#DashboardModule'
    },
    {
       path: 'members',
       loadChildren: 'app/pages/members/members.module#MembersModule'
     },
    { path: '', redirectTo: 'dashboard', pathMatch: 'full' },
    { path: '**', redirectTo: 'dashboard', pathMatch: 'full' },
  ],
}];

路由工作正常，但延迟加载存在问题。

如果我导航到url /dashboard并单击routerLink到/members/add，则MembersModule正在延迟加载 - everythink就可以了。但是，如果我访问url /members/add然后单击routerLink到/dashboard，页面立即打开，没有任何延迟加载，就像它已经加载。

我不明白为什么会这样。

更新：

最顶级的是AppRoutingModule：

export const routes: Routes = [
  {
    path: 'auth',
    canActivate: [LoggedOutGuard],
    loadChildren: 'app/auth/auth.module#AuthModule'
  },
  {
    path: 'pages',
    canActivate: [LoggedInGuard],
    loadChildren: 'app/pages/pages.module#PagesModule'
  },
  { path: '', redirectTo: 'pages', pathMatch: 'full' },
  { path: '**', redirectTo: 'pages' }
];

const config: ExtraOptions = {
  useHash: true,
  enableTracing: true
};

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

PagesCompnent这里只是一个简单的router-outlet

PagesModule（我之前展示的那个）：

const routes: Routes = [{
  path: '',
  component: PagesComponent,
  children: [
    {
      path: 'dashboard',
      loadChildren: 'app/pages/dashboard/dashboard.module#DashboardModule'
    },
    {
       path: 'members',
       loadChildren: 'app/pages/members/members.module#MembersModule'
     },
    { path: '', redirectTo: 'dashboard', pathMatch: 'full' },
    { path: '**', redirectTo: 'dashboard', pathMatch: 'full' },
  ],
}];

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

DashboardRoutingModule：

const routes: Routes = [{
  path: '',
  component: DashboardComponent
}];

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

DashboardComponent是一个模板

MembersRoutingModule：

const routes: Routes = [{
    path: '',
    component: MembersComponent,
    children: [
      {
        path: 'add',
        loadChildren: 'app/pages/members/add/members-add.module#MembersAddModule'
      },
      { path: '', redirectTo: 'add', pathMatch: 'full' },
      { path: '**', redirectTo: 'add', pathMatch: 'full' },
    ],
}];

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

MembersComponent这里是一个简单的router-outlet

MembersAddModule：

@NgModule({
  imports: [
    MembersAddRoutingModule,
    ThemeModule,
  ],
  declarations: [
    MembersAddComponent,
  ],
})
export class MembersAddModule { }

我试过这样做：

const routes: Routes = [{
  path: '',
  component: PagesComponent,
  children: [
    {
       path: 'members',
       loadChildren: 'app/pages/members/members.module#MembersModule'
    },
    {
      path: 'dashboard',
      loadChildren: 'app/pages/dashboard/dashboard.module#DashboardModule'
    },
    { path: '', redirectTo: 'members', pathMatch: 'full' },
    { path: '**', redirectTo: 'members', pathMatch: 'full' },
  ],
}];

，但它的行为相同......

Answer 1

{ path: '', redirectTo: 'dashboard', pathMatch: 'full' },
{ path: '**', redirectTo: 'dashboard', pathMatch: 'full' },

您的基本路线（默认和错误）将重定向到仪表板，这意味着无论您执行什么操作，第一页要加载的是仪表板。

当你在成员页面上时尝试重新加载，然后导航，看看会发生什么。

Answer 2

决议：我在DashboardModule进口PagesModule。现在删除，一切正常。