Routing 2 components with same lazy load modules

Question

I have BookModules, and 2 components BookCreate and BookEdit. How to differentiate them when I use lazyload modules. Suppose that I have 2 buttons create and edit in homepage. I want to click each button will navigate to bookCreate/bookEdit component

I want like that: myweb/store/book -> BookCreateComponent myweb/profile/12345/edit -> BookEditComponent in HomeRoutes

      {
        path: 'book',
        loadChildren: 'app/run/run.module#BookModule'
      } 

In BookRoutes

  {
    path: '',
    component: BookCreateComponent
  }
  // I don't know how routing to BookEditComponent 

Answer 1

look at this my example:

Module:

use any option 1 or 2
    1) {
        path: "profile",
        loadChildren: "app/profile/profile.module#ProfileModule"
    },
    2) {
        path: "profile",
        loadChildren: "./profile/profile.module#ProfileModule"
    },

ProfileRoutes

    {
       path: '',
       component: ProfileComponent
    }
    {
       path: ':id',
       component: BookCreateComponent
    }
    {
       path: ':id/edit',
       component: BookEditComponent
    }

Template:

  <a [routerLink]="['/profile/'+ user_id]">create</a>
  <a [routerLink]="['/profile/' + user_id +'/edit']">edit</a>

Answer 2

If i understood you correctly, i would add a second route to the BookModule:

  {
    path: '',
    component: BookCreateComponent
  },      
  {
    path: 'edit',
    component: BookEditComponent
  }

Then you can route to it like that:

[routerLink]="book/edit" -> BookEditComponent
[routerLink]="book" -> BookCreateComponent