How to router.navigate to same route in Angular 4 and catch the same event?

Question

Okay, I have two use cases for my question here:

1. I\'m working on an application which has a /en/register route. It all works good when I\'m at t

Answer 1

For case 1,

Why do you navigate to a new route just to open a modal. Just do it being at the same route with a function call. If you want to move to a new route then you can again call this.router.navigate("/") in modal close event.

For case 2, Hope this will work.

currentSearchQuery: string;

ngOnInit() {
  this.route.paramMap
    .switchMap((params: ParamMap) => {
        this.currentSearchQuery = params.get('searchQuery');
        updateMarkers();
      });

}

Answer 2

i use this workaround

this.router.navigate(['path']).then(()=>  {window.location.reload();});

Answer 3

Just add dummy parameter at the end of the route /en/register/jk2h4-42hj-234n2-234dfg or query parameter like /en/register?val=jk2h4-42hj-234n2-234dfg

change the parameter value when calling the same route. So browser knows that URL change and Angualr component start to work from full life cycle.

Answer 4

When I needed to "reload" the current component's constructor and ngOnInit functions, the only solution I found was kind of a workaround:

I used the fact that "this.router.navigate" returns a promise. So I navigated somewhere else, and returned. It's a bit ugly but it works and the UI is not affected:

this.router.navigate(..[somewhere else]..)
    .then(()=>{this.router.navigate(..back..)})

Hope it helps.