Подтвердить что ты не робот

Переход на тот же маршрут, не обновляющий компонент?

Я обновил, чтобы использовать новый маршрутизатор Angular 2 от устаревших маршрутизаторов, а некоторые изменения изменились.

Страница, с которой у меня возникают проблемы, - это страница поиска. Мы решили поместить все поисковые термины в URL с помощью HashLocationStrategy. Маршруты выглядят следующим образом:

const routes: RouterConfig = [
  { path: '', component: HomeComponent },
  { path: 'search/:term/:cat/:page/:sort/:size/:more', component: HomeComponent },
  { path: 'search/:term/:cat/:page/:sort/:size', component: HomeComponent },
  { path: 'search/:term/:cat/:page/:sort', component: HomeComponent },
  { path: 'search/:term/:cat/:page', component: HomeComponent },
  { path: 'search/:term/:cat', component: HomeComponent },
  { path: 'search/:term', component: HomeComponent },
  { path: 'details/:accountNumber', component: DetailsComponent }
];

Я знаю, что подход с строкой запроса может быть лучше подходит для всех этих вариантов, но требования к проекту решаются другими людьми...

В любом случае, если я перейду к localhost/#/search/Hello с помощью this.router.navigate(['/search/Hello']);, тогда маршрутизатор работает отлично, и все отлично. Хотя на этой странице, если я пытаюсь this.router.navigate(['/search/World']);, тогда URL-адрес в адресной строке браузера будет обновляться соответствующим образом, но компонент вообще не изменяется.

Раньше я мог использовать routerCanReuse, чтобы указать, что я хотел повторно использовать компонент поиска, а routerOnReuse повторил поиск при наступлении навигации. Я не вижу эквивалентных им в @angular/router. Как я могу перезагрузить текущий маршрут с новыми параметрами URL?

Я запускаю версию 2.0.0-rc.3 для Angular 2 и 3.0.0-alpha.8 из @angular/router.

4b9b3361

Ответ 1

Если изменяются только параметры, сам компонент не будет инициализироваться снова. Но вы можете подписаться на изменения в параметрах, которые вы отправляете.

Например, по методу ngOnInit вы можете сделать что-то вроде этого:

ngOnInit() {
    this.sub = this.route.params.subscribe(params => {
       const term = params['term'];
       this.service.get(term).then(result => { console.log(result); });
     });
  }