I have angular app with routes to components
Here is routes file
const routes: Routes = [
{ path: '', component: HomeComponent },
{
path: 'main',
children: [
{ path: 'faq', component: FaqComponent },
{ path: 'faq-mobile', component: FaqMobileComponent },
{ path: 'neighborhoods', component: NeighborhoodsComponent },
{ path: 'sales', component: SalesComponent },
{ path: 'commercials', component: CommercialsComponent },
{ path: 'rentals', component: RentalsComponent },
{ path: 'contact-us', component: ContactUsComponent },
{ path: 'list-with-us', component: ListWithUsComponent },
{ path: 'no-mobile', component: NoMobileComponent },
{ path: 'about-us', component: AboutUsComponent },
{ path: 'jobs', component: JobsComponent },
{ path: 'rooms', component: RoomsComponent },
{ path: 'join-the-hunt', component: JoinTheHuntComponent },
{ path: 'apply', component: ApplyMainComponent },
{ path: 'apply/:id', component: ApplyDetailsComponent },
{ path: 'home-mobile', component: HomeMobileComponent },
{ path: 'getting-approved', component: GettingApprovedComponent },
],
},
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule],
})
export class AppRoutingModule {}
When for example I use link http://localhost:4200/main/apply and just refresh link it returns me to http://localhost:4200
How I can make it to stay at http://localhost:4200/main/apply?
In my angular-project I have it like this:
{
path: '',
redirectTo: 'dashboard',
pathMatch: 'full'
}
--> so adding pathMatch: 'full' might do the trick here.
Use { path: '', component: HomeComponent, pathMatch: 'full' } for your first route. When you refresh you get redirected to HomeComponent because it is the first route that matches your path.
Have a look at: In Angular, What is 'pathmatch: full' and what effect does it have?