Question

我只有两个可选参数的路线。默认情况下，当我尝试从一条路线导航到另一条路线时，没有任何反应。那很好。我知道 routeParams.data.subscribe（...）功能，但是这种方法不适合我，我需要完全重新初始化组件。这就是为什么在演示中，我将自定义RouteReuseStrategy与标志 data {reuse：true} 一起使用的原因。我借用了RouteReuseStrategy from here。

演示中的预期行为：转到“主页”选项卡，进行一些+1，单击“转到相同路线”按钮（此导航到相同的HomeViewComponent），HomeViewComponent必须重新初始化，Counter必须为0。

但未重新创建组件，Counter相同。 Stackblitz demo。谢谢！

Answer 1

Since Angular 5.1，您可以在定义路线时使用onSameUrlNavigation选项：

RouterModule.forRoot([
  { path: 'login', component: LoginViewComponent },
  { path: ':one/:two', component: HomeViewComponent, data: {reuse: false} },
  { path: '**', redirectTo: 'login' }
], { onSameUrlNavigation: 'reload' })

还如下更改您的CustomRouteReuseStrategy::shouldReuseRoute方法：

public shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {
    return future.data.reuse !== undefined ? 
           future.data.reuse : 
           future.routeConfig === curr.routeConfig;
}

Forked Stackblitz Example

具有可选路由的Angular RouterReuseStrategy

1 个答案: