Angular RouterReuseStrategy с необязательным маршрутом

Question

У меня есть маршрут только с двумя дополнительными параметрами. По умолчанию, когда я пытаюсь перейти от одного этого маршрута к другому, ничего не происходит. И это нормально. Я знаю о функции routeParams.data.subscribe (...) , но этот подход мне не подходит, мне нужно полностью переинициализировать компонент. Вот почему в моей демонстрации я использую пользовательский RouteReuseStrategy с флагом data {reuse: true} . Я заимствую RouteReuseStrategy отсюда .

Ожидаемое поведение в демоверсии: перейдите на вкладку «Домой», добавьте +1, нажмите кнопку «Перейти к тому же маршруту» (это перейти к тому же самому HomeViewComponent), HomeViewComponent должен повторно инициализироваться, и значение Counter должно быть 0.

Но компонент не воссоздан, Счетчик тот же. Демонстрация Stackblitz . Спасибо!

Answer 1

Начиная с 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;
}

Пример с разбитым стеком