如何将路由委托给子组件？

Question

在最后一个角度连接处，组件路由器1.0被显示，并且它具有一个功能，您可以使用双点表示法将路径的子树委托给某个组件。请参阅：https://www.youtube.com/watch?v=z1NB-HG0ZH4&feature=youtu.be&t=720。

我是这个功能的忠实粉丝，因为你可以构建一个需要自己路由的大型组件（例如聊天系统），但是所有这些都封装在子组件中，因此无论在哪里都使用它作为黑盒子你自找的。如果您在一个大型团队中工作，这对于可重用组件来说是一个很棒的功能。

在路由器3.0中，这似乎消失了，而是在嵌套数组中指定组件的子路由。

这是否意味着您必须预先构建整个路由树，如果您移动组件，则需要手动更改此树？这是否意味着您不能拥有具有自己封装路由的组件？ 如果我错了，怎么在3.0路由器中完成？

Answer 1

  

这是否意味着您不能拥有具有自己的封装路线的组件？

嗯，路由器肯定不会存在于component.ts文件中，但您可以将路径的一部分放在同一组件文件夹下的服务文件中，并使用路径的相对路径。

  

如果你移动组件，你需要手动更改这个树吗？

您只需要更改一个连接到该组件的路由。我认为它并没有真正改变很多。

通过使用单独的路由文件，它允许我们延迟加载组件。

来自doc

  

在单独的文件中定义配置为未来铺平了道路   我们立即加载路由配置但延迟加载   组件本身直到用户需要它们。

     

这种异步路由可以使我们的应用程序启动更多   很快。我们将在以后的章节更新中介绍异步路由。

Answer 2

您的组件路由在单独的组件路由文件中定义，然后该文件/对象将导入主路由器。因此它们仍然是封装的，但是四处移动，重复将需要额外导入主路由器。

来自文档（大约一半，就在上面＆＃34;里程碑＃3＆＃34;：

https://angular.io/docs/ts/latest/guide/router.html

Answer 3

您可以在父组件中使用它：

@RouteConfig([
    {path: '/', component: HomeComponent, as: 'Home'},
    {path: '/list/...', component: ListComponent, as: 'List'}
])

然后在ListComponent中，定义子路由：

@RouteConfig([
  { path: '/:id', component: ListItem, as: 'ListItem' }
])

确保ListComponent也有一个..