Angular 2 管理 Route 的状态变化

Question

基本上，我有 2 条路线：

{ path: ':id', component: VideosListComponent },
{ path: '', redirectTo: '/0', pathMatch: 'full' }

在应用程序 route root 中，我通过VideosListComponent 列出视频。点击视频后，我需要显示视频并防止更改路由器状态，这样组件就不会重新初始化。

但是当我使用这样的路线时：

{ path: '', component: VideosListComponent },   
{ path: ':id', component: VideosListComponent }

当:id 改变时，路由器状态也会改变。

第一个解决方案有效，但我不喜欢我的应用根目录重定向到 /0。

问题：是否可以实现将路由从/ 更改为/:id 不会改变路由器状态？

---

解决方案 我已经根据@admax 让它工作了。我制作了 parent 和 child 路线。从我的父 VideoList 组件我将所有 showPlayer 功能移动到 Child PlayerComponent。在 Angular 2 中，这似乎是正确的做法。

Answer 1

这个变体应该适合你：

{ path: '', component: VideosListComponent },   
{ path: ':id', component: VideosListComponent }

当 :id 改变时路由器状态也会改变。

Router状态会改变，但是组件实例会被复用，因为两个路由声明使用相同的组件类型，所以组件状态会被保留。您只需要对参数变化做出反应并根据它实现状态。

this.route.params.subscribe(params => {
    if (params['id']) {
       // display video
    } else {
       // display list
    }
});

还有一个建议：如果视频列表必须在两个“页面”上呈现，也许应该将其移至父路由？

{ 
    path: '', 
    component: VideosListComponent,
    children: [
        { path: '', component: SomeEmptyComponent },
        { path: ':id', component: VideoDetailsComponent }
    ]
}