Angular router.navigate doesn't route to resolver if on same component

Question

I perform my searching from the navbar component at the top of the page. I can route to my 'member' component page when entering the search criteria from the navbar, but once I'm on the 'member' component and I change the query params and try to run the router.navigate() again I can't get Angular to hit my resolver.

here is what I do and what I tried above the navigate call, neither shouldReuseRoute or onSameUrlNavigation seem to work to hit my resolver again once on the component.

Question is - should it? Because maybe I have something else wrong somewhere!

// tried with no luck
this.router.routeReuseStrategy.shouldReuseRoute = () => false;
// tried with no luck
this.router.onSameUrlNavigation = 'reload';
this.router.navigate(['/members'], {
  queryParams: {
    latitude: this.locationLatitude,
    longitude: this.locationLongitude,
    gender: this.gender,
    minAge: this.ageFrom,
    maxAge: this.ageTo,
    orderBy: this.orderBy
  }
});

score 3 · Answer 1 · answered Aug 25 '21 at 22:29

Routes can have the runGuardsAndResolvers property set to always to always run guards and resolvers on navigation. By default they run when the route or route params change.

{
  path: 'some/path/:and/:id',
  component: MemberComponent,
  ...
  runGuardsAndResolvers: 'always'
}

score 0 · Answer 2 · answered Jan 20 '20 at 05:23

0

You will need to subscribe to the query params change

constructor(
    private activatedRoute: ActivatedRoute,
) { }

this.activatedRoute.queryParams.subscribe(params => {
    console.log(params);
    // logic after subscribing
});

so basically anytime you change the queryParams it will fire that subscription and you can run your logic from there

answered Jan 20 '20 at 05:23

Smokey Dawson

8,827
19
77
152

Where should this route `subscribe` be written ? – Sixteen Jul 07 '21 at 09:52
@Sixteen you can write it wherever, but i would usually put it in the `ngOnInit` – Smokey Dawson Jul 19 '21 at 06:14

score 0 · Answer 3 · answered Sep 19 '20 at 06:08

Actually, resolvers are called in those situations. You can check it simply by debugger. I had a similar problem recently and it occurs that I had a bug in my resolver and another one in component (as @smokey-dawson wrote - I missed subscription on route.data in my case)

Angular router.navigate doesn't route to resolver if on same component

3 Answers3