0

When I am trying to reload the url, the page refreshes to the default navigation. I want to stop that and reload the same url again. This is how my routing module looks like:

const routes: Routes = [
 {
  path: 'store', component: AppComponent, children:
  [
    { path: 'public', component: HomeComponent, data: { defaultSelectedTab: 0 } },
    { path: 'public/softwares', component: HomeComponent, data: { selectedValue: 'softwares', defaultSelectedTab: 0 } },
    { path: 'public/softwares/:id', component: SoftwareDetailsComponent },
    { path: '', redirectTo: "public", pathMatch: 'full' },
  ]
},
{
  path: '**', component: EmptyComponent
}
];

@NgModule({
   imports: [RouterModule.forRoot(routes, { useHash: true, onSameUrlNavigation: 'reload'})],
   exports: [RouterModule]
})
export class AppRoutingModule { }

I tried to do something like this where each of the independent path become a children of the previous one:

        { 
          path: 'public', 
          component: HomeComponent, 
          data: { defaultSelectedTab: 0 }, 
          children: [
            { 
              path: 'softwares', 
              component: HomeComponent, 
              data: { selectedValue: 'softwares', defaultSelectedTab: 0 }, 
              children: [
                { 
                  path: ':id', 
                  component: SoftwareDetailsComponent 
                }
              ]
            }
          ]
        },
        { path: '', redirectTo: "public", pathMatch: 'full' },

But then this one doesn't even route it to the right component. I was trying to take a clue from the answer with the max votes. If in case it helps the router-outlet is specified in AppComponent. Still I am not sure what am I doing wrong. Any help is much appreciated.

Manit
  • 1,087
  • 11
  • 17
  • I believe your server changes the url. you can check if it is true in the network tab. just check the "preserve log" checkbox – Andrei Jun 29 '22 at 16:43
  • I am trying to run it in local so, the files are getting served from local. The zuul configuration doesn't come into play. Also, to confirm I made some changes and the routing seems to show a different url. I just added one more information that the router-outlet is present in AppComponent. – Manit Jun 29 '22 at 17:04
  • what is serving the files from local? angular serve command? – Andrei Jun 29 '22 at 17:14
  • yes, the ng serve command is serving the files from local – Manit Jun 29 '22 at 17:24
  • most likely during refresh you have an error on some code executed. you should check the console for it – Andrei Jun 29 '22 at 17:26
  • Please check whether you have added a routing statement in the ngOnInit() of first default component. – Swapnil Sourabh Jun 29 '22 at 17:49
  • Maybe because of wild card routing configure, try to remove it and check – Kishan Vaishnani Jun 29 '22 at 18:14
  • @KishanVaishnani - I have tried removing the path '' object. The issue that I see is that the first time when I try to load the specific path by writing the url in the browser, it loads but as soon as I click on refresh... it defaults to http://127.0.0.1:4200/#/store – Manit Jun 29 '22 at 18:48
  • @SwapnilSourabh: I can see that we are trying to get the data from activatedRoute, nothing else in ngOnInit – Manit Jun 29 '22 at 18:50
  • 1
    @SwapnilSourabh - found the culprit piece of code. Your clue was in the right direction. Thank you. – Manit Jun 29 '22 at 18:58
  • Thanks @Andrei and KishanVaishnani too for your time. – Manit Jun 29 '22 at 18:58

0 Answers0