Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the use of onSameUrlNavigation property in Angular( versions greater than 5)

Recently I have heard about a property called onSameUrlNavigation where you can set it to "reload". I have googled about it but there are not many articles which shows the use of that property. Can somebody help me with a real time example of where exactly we need to use that property.

@ngModule({
 imports: [RouterModule.forRoot(routes, {onSameUrlNavigation: ‘reload’})],
 exports: [RouterModule],
 })
like image 922
ark Avatar asked Jan 06 '19 14:01

ark


2 Answers

For me, adding onSameUrlNavigation made absolutely no different to my Angular routing at all.

When trying to navigate from, say, /users:123 to /users:234, that option wouldn't allow me to refresh the page. My Angular pages have complex grids on them, and I specifically needed them to be disposed, and recreated, when I swap to a different user.

What did work (kill me now...) was to add this to my code.

let newRouterLink = '/users:123';
this.router.navigate(['/']).then(() => { this.router.navigate([newRouterLink ]); })

It's ugly, but it does the job....

like image 56
Mike Gledhill Avatar answered Sep 22 '22 14:09

Mike Gledhill


onSameUrlNavigation configures how the router handles navigation to the current URL. By default, the router will ignore this navigation. However, this prevents features such as a "refresh" button. Use this option to configure the behavior when navigating to the current URL. Default is 'ignore'.by setting it to ‘reload’ you can navigate the current rout and trigger the router events again by setting it to 'ignore' if you navigate to same page it won't change the rout, see this example:

imports: [ BrowserModule, FormsModule, RouterModule.forRoot(routes, {
    // onSameUrlNavigation: 'ignore',
    onSameUrlNavigation: 'reload'
  }) ],
like image 22
Fateme Fazli Avatar answered Sep 20 '22 14:09

Fateme Fazli