angular2 延迟加载模块路由答案

【问题标题】：angular2 lazy loading module routesangular2 延迟加载模块路由
【发布时间】：2017-08-21 22:11:37
【问题描述】：

我在我的主路由模块上得到了这个：

 { 
    path: 'alpha/aaa', 
    loadChildren: 'app/connection/connection.module#ConnectionModule'
  },

  { 
    path: 'num/123', 
    loadChildren: 'app/connection/connection.module#ConnectionModule'
  },

  { 
    path: 'rand/a2b1', 
    loadChildren: 'app/connection/connection.module#ConnectionModule'
  },

路由不同，但它们在一个模块中，因为它们具有相同的模板和功能。

我的问题是，如果这些是我需要的确切路径，我将如何在子模块的路径中映射上面定义的路径？所以我尝试了以下但没有奏效：

const routes: Routes = [
  { path: 'alpha/aaa', pathMatch:'full', component: Component1 },
  { path: 'num/123', pathMatch:'full', component: Component2 },
  { path: 'rand/a2b1', pathMatch:'full', component: Component3 }
];

【问题讨论】：

这行得通吗？ { 路径：''，组件：WeAreSharingComponent }
哇！编辑:)！他们使用不同的组件。
这个怎么样：{ path: '/alpha/aaa', component: Component1 } 斜线前面的非相对路径？
试过但没用。我可以将每个模块分开以拥有自己的模块并为三个模块创建一个通用模块。我只是在想，一定有办法让它发挥作用。我不敢相信有人没有遇到同样的问题。

标签： angular routes

【解决方案1】：

很遗憾，这是不可能的，但是如果您更改路线并为整个模块提供通用路线，您可以实现类似的效果。即：

{ 
    path: 'connection', 
    loadChildren: 'app/connection/connection.module#ConnectionModule'
}

然后像现在这样

const routes: Routes = [
  { path: 'alpha/aaa', component: Component1 },
  { path: 'num/123', component: Component2 },
  { path: 'rand/a2b1', component: Component3 }
];

然后您可以像访问它们一样访问它们

/connection/alpha/aaa 
/connection/num/123
/connection/rand/a2b1

【讨论】：