title: How to set router in multiple levels lazy loading of ANGULAR 6
body: <p>I am new to Angular and writing my first <strong>Angular</strong> application.
  I want this 'app' have three layouts : Public , Mumber and Admin.
  I created project like:</p>
  
  <pre><code>|-src
  |-app
      |-public(module)
          |-home(module)
              |-pages(foler)
                  |-index(component folder)
                      |-index.component.ts(like a controler include the selector of article-list component and product-list component, inject article service and product service)
              |-components
                  |-article-list(component folder)
                      |-article-list.component.css
                      |-article-list.component.html
                      |-article-list.component.ts
                  |-product-list(component folder)
                      |-product-list.component.css
                      |-product-list.component.html
                      |-product-list.component.ts
              |-home-routing.module.ts
              |-home.component.ts
              |-home.module.ts
          |-article(module)
              |-pages(folder)
                  |-index(component folder)
                      |-index.component.ts(like a controler include the selector of article-list component, inject article service)
                  |-list-by-category(component folder)
                      |-list-by-category.component.ts(like a controler loop category and include the selector of article-list component, inject article service)
                  |-detail(component folder)
                      |-detail.component.ts(like a controler include the selector of article-detail component, inject article service)
              |-components(folder)
                  |-article-list(component folder)
                      |-article-list.component.css
                      |-article-list.component.html
                      |-article-list.component.ts
                  |-article-detail(component folder)
                      |-article-detail.component.css
                      |-article-detail.component.html
                      |-article-detail.component.ts
              |-article-routing.module.ts
              |-article.component.ts
              |-article.module.ts
          |-product(module)
              |-pages(folder)
                  |-index(component folder)
                      |-index.component.ts(like a controler include the selector of product-list component, inject product service)
                  |-list-by-category(component folder)
                      |-list-by-category.component.ts(like a controler loop category and include the selector of product-list component, inject product service)
                  |-detail(component folder)
                      |-detail.component.ts(like a controler include the selector of product-detail component, inject product service)
              |-components(folder)
                  |-product-list(component folder)
                      |-product-list.component.css
                      |-product-list.component.html
                      |-product-list.component.ts
                  |-product-detail(component folder)
                      |-product-detail.component.css
                      |-product-detail.component.html
                      |-product-detail.component.ts
              |-product-routing.module.ts
              |-product.component.ts
              |-product.module.ts
          |-shared(folder)
              |-components
                  |-header(component folder)
                  |-footer(component folder)
              |-services
                  |-article.service.ts
                  |-product.service.ts
              |-models
                  |-article-list-item.ts
                  |-article-detail.ts
                  |-product-list-item.ts
                  |-product-detail.ts
          |-public-routing.module.ts
          |-public.component.ts
          |-public.module.ts
      |-member(module)
          |-blog(module)
              |-pages
              |-components
              |-blog-routing.module.ts
              |-blog.component.ts
              |-blog.module.ts
          |-album(module)
              |-pages
              |-components
              |-album-routing.module.ts
              |-album.component.ts
              |-album.module.ts
          |-shared(folder)
              |-components
              |-services
              |-models
          |-member-routing.module.ts
          |-member.component.ts
          |-member.module.ts
      |-admin(module)
          |-dashboard(module, like the home module in public module)
          |-article(module)
              |-pages
              |-components
              |-article-routing.module.ts
              |-article.component.ts
              |-article.module.ts
          |-product(module)
              |-pages
              |-components
              |-product-routing.module.ts
              |-product.component.ts
              |-product.module.ts
          |-shared(folder)
              |-components
              |-services
              |-models
          |-admin-routing.module.ts
          |-admin.component.ts
          |-admin.module.ts
      |-app-routing.module.ts
      |-app.components.ts
      |-app.module.ts
  index.html
  ....
  </code></pre>
  
  <p>I hope <strong>URLs</strong> like:</p>
  
  <ul>
  <li>Public:</li>
  <li><a href="http://localhost:4200" rel="nofollow noreferrer">http://localhost:4200</a> --public home</li>
  <li><a href="http://localhost:4200/articles" rel="nofollow noreferrer">http://localhost:4200/articles</a>  --article home</li>
  <li><a href="http://localhost:4200/articles/category/1" rel="nofollow noreferrer">http://localhost:4200/articles/category/1</a>  --article list</li>
  <li><a href="http://localhost:4200/article/12" rel="nofollow noreferrer">http://localhost:4200/article/12</a>  --article detail</li>
  <li>Member:</li>
  <li><a href="http://localhost:4200/member/memberId" rel="nofollow noreferrer">http://localhost:4200/member/memberId</a>  --member home</li>
  <li><a href="http://localhost:4200/member/memberId/blogs" rel="nofollow noreferrer">http://localhost:4200/member/memberId/blogs</a>  --blog list</li>
  <li><a href="http://localhost:4200/member/memberId/blog/blogId" rel="nofollow noreferrer">http://localhost:4200/member/memberId/blog/blogId</a>  --blog detail</li>
  <li>admin:</li>
  </ul>
  
  <p>....</p>
  
  <p>Contents of 'app-routing.module.ts':</p>
  
  <pre><code>{
      path: 'member',
      loadChildren: './member/member.module#MemberModule'
    },
    {
      path: 'admin',
      loadChildren: './admin/admin.module#AdminModule'
    },
    {
      path:'',
      loadChildren:'./public/public.module#PublicModule'
    }
  </code></pre>
  
  <p>contents of public-routing.module.ts</p>
  
  <pre><code>{
  path: '',
  component: PublicComponent,
  children: [
    {
      path: 'article',
      loadChildren: './article/article.module#ArticleModule'
    },
    {
      path: 'product',
      loadChildren: './product/product.module#ProductModule'
    }
  ]
  </code></pre>
  
  <p>}</p>
  
  <p>Contents of <strong>article-routing.module.ts</strong></p>
  
  <pre><code>{
      path: 'category/:id',
      component: ListByCategoryComponent
    },
    {
      path: 'article/:id',
      component: DetailComponent
    },
    {
      path: '',
      component: IndexComponent
    }
  </code></pre>
  
  <p><strong>But questions is coming:
  the actually result is</strong></p>
  
  <pre><code>public:
  http://localhost:4200 --public home
  http://localhost:4200/article --article home
  http://localhost:4200/article/category/1 --article list
  http://localhost:4200/article/12 --article detail
  </code></pre>
  
  <p><strong>I think the question is the contents of public-routing.module.ts, how can i change it?</strong>
  Another question: when i config routing of public-routing.module.ts and admin-routing.module.ts the angular cli throw:</p>
  
  <blockquote>
    <p>ERROR in Duplicated path in loadChildren detected:
    "./article/article.module#ArticleModule" is used in 2 loadChildren</p>
  </blockquote>
  
  <p>I think i should generate public-article module in public and admin-article module in admin, is it right?</p>