Angular routing: Home page URL should be http://localhost:4200/

Question

I have done URL routing in my project. When I redirect to the home page URL becomes http://localhost:4200/home.

I want my home page URL to be http://localhost:4200/ instead of http://localhost:4200/home

My app.routing.ts file:

    const routes: Routes = 
    [
     {
      path: '',
      redirectTo: 'home',
      pathMatch: 'full'
     },
     {
      path: '',
      component: LayoutComponent,
      children: [
       {
         path: 'home',
         loadChildren: './home/home.module#HomeModule'
       }
      ]
     }
    ];

And below is the home.routing.ts file:

    const routes: Routes = [
     {
      path: '',
      component: HomeComponent
     }
    ];

Any help would be appreciated, Thanks.

Answer 1

You can achieve the same using the following way

app.routing.ts

const routes: Routes = [
  {
    path: '',
    loadChildren:
      './home/home.module#HomeModule'
  },
  {
    path: '',
    loadChildren:'./another/another.module#AnotherModule'
    
  }
  
];

And in the Home module router

const routes: Routes = [
  {
    path: '',
    component: LayoutComponent,
    children: [
      {
        path: '',
        component: HomeComponent,
       
      },
      {
        path: 'other',
        component: otherComponent,
      },
    ]
  }
];