Problem changing root and not changing page after that in angular

Question

I have a notification module ,in that module i should redirect user to other pages for showing notification detail .

I have a problem with this :

when i enter this route payment/detail/1254 for first time , every thing is ok , but then i need to change route to this for show other notification detail payment/detail/8547 , the route changes , but the page not change not show me previous detail .

i know i can use this code in every component i need :

  router.events.subscribe((val) => {
    // see also 
    console.log(val instanceof NavigationEnd) 
});

but i have a more than 40 modules . i want use the this code in common place , i need write this code or same code in the common place and I do not have this problem every time the route changes.

how can i solve this problem ???

would you mind building a stackbit.com minimal example showing the problem you are facing? — The Fabio
– The Fabio, Commented Jun 28, 2021 at 5:07

Stavm · Accepted Answer · 2021-06-28 06:22:35Z

Problem: you navigate from route A to route A with different parameters. this causes the router to not do anything, by default, as you're navigating to the same page.

Possible solutions:

One approach would be to subscribe to ActivatedRoute's paramMap and fetch the details every time it emits. preferably piped with distinctUntilChanged() to avoid reloading the page when navigating to same page with same parameter.

constructor(private route: ActivatedRoute)

ngOnInit() {
    this.route.paramMap
     .pipe(distinctUntilChanged((prev, curr) => prev.id === curr.id))
     .subscribe(({id}) => this.getDetails(id));
}

a Different approach would be to configure your router to reload when navigating to the same route.

     @NgModule({
       imports: [
           RouterModule.forRoot(routes, { onSameUrlNavigation: 'reload' })
       ],
       exports: [RouterModule],
     })

This obviously might add a performance hit, depending on your architecture.

Collectives™ on Stack Overflow

Problem changing root and not changing page after that in angular

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related