I have 2 components in angular

1. Webpage
2. Registeration Form

The routes should be like

localhost:4200 - Home Component
localhost:4200/register - Registeration Component

But in router modules nothing can be set on base path

  { path: 'home', component: HomeComponent },
  { path: 'register', component: RegisterComponent },
  { path: 'admin', component: PlayerListComponent },
  { path: '', redirectTo: 'home', pathMatch: 'full' }

App component :

<router-outlet></router-outlet>

Final output :

localhost:4200/home - Home Component
localhost:4200/register - Registeration Component

How can I set one component on ROOT and others as default routing system works. Also if there's a way to deploy it in Nginx with some configuration to set /home as /, I am open to that solution as well

CodePudding user response：

If these routes are completely independent of each other, the correct way to do this is to set the Home Component path blank and remove the redirection object, like this:

  { path: '', component: HomeComponent },
  { path: 'register', component: RegisterComponent },
  { path: 'admin', component: PlayerListComponent },