像许多其他人一样，我也喜欢将我的组件分成容器（智能）组件和表示（哑）组件 . 当然我也喜欢我的应用程序使用路由器，以便用户可以轻松浏览应用程序，为特定页面添加书签（或者我应该说明状态？）等 .
我真正希望用户拥有的一个功能是能够在新标签中打开链接或直接复制链接的URL . 显然我使用了由Angular的RouterModule提供的routerLink指令 . 但这让我想到了一个概念问题，我不知道如何解决 .
假设我定义了以下路由和组件：
'/heroes' --> HeroesPageComponent (contains a <router-outlet>)
'' --> HeroesListPageComponent (contains <heroes-list> component)
'/:id' --> HeroesDetailPageComponent (contains <hero-detail> component)
页面组件是“智能组件”，它从路由器获取所需的数据（如ID）并获取数据，然后将它们简单地传递给作为表示组件的子节点（HeroesListComponent和HeroDetailComponent） .
在我的示例中，HeroesListComponent应该对其边界外的应用程序一无所知，以便在其他上下文中保持可重用（例如Angular Docs示例中的CrisisCenter） . 但在这种情况下，我希望显示列表中的每个英雄都有一个指向'/ heroes /：id'的链接，以便用户可以在单独的选项卡/窗口中打开和编辑每个英雄 . 但是要使用routerLink构建此链接，组件必须了解已配置的路由以及它在何种上下文中的使用 . 这将使重用组件变得相当困难 .
是否有关于如何充分利用两个世界的最佳实践？关于如何保持演示组件尽可能笨，同时允许它们为其他页面创建实际的href？
我希望我的榜样足够清楚 . 如果没有，请告诉我:)
谢谢！