Angular2 child routes

Ask Time：2016-12-14T01:01:26 Author：sudharsan tk

I have root module and a child module in angular2, both has its own routes defined. In child module am configuring RouterModule as

RouterModule.forChild(ROUTES)

In root module(parent) , am configuring RouterModule as

RouterModule.forRoot(ROUTES)

I am using same routes names in both child and root

In child

export const ROUTES: Routes = [
  { path: '',      component: HomeComponent }, //outputs I am child
  { path: 'home',  component: HomeComponent }
];

In root (parent)

export const ROUTES: Routes = [
  { path: '',      component: HomeComponent }, //outputs I am parent
  { path: 'home',  component: HomeComponent }
];

I am importing child module in root module

import .....
import {AppModule as ChildModule} from 'child-module/src/app/app.module';


@NgModule({
  bootstrap: [ AppComponent ],
  declarations: [
    AppComponent,
    HomeComponent
  ],
  imports: [ // import Angular's modules
    BrowserModule,
    FormsModule,
    HttpModule,
    ChildModule,
    RouterModule.forRoot(ROUTES, { useHash: true, preloadingStrategy: PreloadAllModules })

  ],
  providers: [
  ]
})
export class AppModule {

}

When I load my component (I mean root module), default route is always going to child module instead of rootmodule ie its printing "I am child" ,where as I expect "i am parent", child route should be loaded only when I load it, how can I route it to default route of root (parent) module instead of child module?

Author:sudharsan tk，eproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article：https://stackoverflow.com/questions/41126645/angular2-child-routes

Angular2 child routes