Angular 延迟从不同路径加载相同模块

我有以下

应用程序路由.module.ts

：

  {
    path: 'discover',
    loadChildren: () => import('./components/platform/user-profile/platform.module').then(m => m.PlatformModule)
  },
  {
    path: ':userRoute',
    loadChildren: () => import('./components/platform/user-profile/platform.module').then(m => m.PlatformModule)
  },

我的目标是/discover应该从PlatformModule打开DiscoveryPageComponent

/userName1应该从PlatformModule打开UserPageComponent

My

平台路由.module.ts

包含以下内容：

  {
    path: '',
    component: UserProfileComponent,
  },
  {
    path: 'discover',
    component: DiscoverPageComponent,
  },

这不起作用，因为/discover将始终打开UserProfileComponent而不是DiscoverPageComponent。我只能从/userName1/discover打开DiscoveryPageComponent

如何让这两个不同的路由从同一个延迟加载的模块打开它们的特定组件

Stackblitz:

---

请参阅/discover和/anyUserName1

尝试下面的示例代码，在路由模块中进行更改

在app-routing.moudle.ts中：

const routes: Routes = [
  {
    path: '',
    loadChildren: () => import('./platform/platform.module').then(m => m.PlatformModule)
  },
];

在platform-routing.module.ts中：

const routes: Routes = [
  {
    path: "user",
    children: [
      {
        path: ":user",
        component: UserProfileComponent
      }
    ]
  },
  {
    path: "discover",
    component: DiscoverComponent
  },
  {
    path: "",
    redirectTo: "discover",
    pathMatch: "full"
  }
];

---

你能在stackblitz上复制它吗？部分修复-在platform-routing.module.ts中将

UserProfileComponent

替换为

DiscoveryPageComponent

，将

DiscoveryPageComponent

替换为

UserProfileComponent

。现在

/discover

打开

DiscoverPageComponent

我建议您使用类似于带有路由器插座的platform-container.component.ts。然后在“”路径定义容器并定义子项：[{path:''，组件：UserProfileComponent}，{path:'DiscoverPageComponent'，组件：DiscoverPageComponent}，]此设置将起作用。@piyushjain现在任何操作都会打开DiscoverPageComponent，但没有任何操作会打开UserPageComponent:）@MikeS。我添加了一个StackBlitz，我还建议将用户路径命名为

user/：user

，而不仅仅是

：user

。我无法更改用户路径。instagram.com/example看起来比instagram.com/user/example好