title: Angular 2 nested navigation with new router
body: <p>How can I achieve nested navigation? I had this with the previous router.</p>
  
  <pre><code>{ path: '/admin/...', component: AdminLayoutComponent }
  </code></pre>
  
  <p>It seems that from rc1 angular2 doesn't support this. </p>
  
  <p>From the documentation.
  <a href="https://angular.io/docs/ts/latest/guide/router.html" rel="nofollow">https://angular.io/docs/ts/latest/guide/router.html</a> </p>
  
  <p>Notice that the path ends with a slash and three trailing periods (/...).</p>
  
  <p>That means this is an incomplete route (a non-terminal route). The finished route will be some combination of the parent /crisis-center/ route and a route from the child router that belongs to the designated component.</p>
  
  <p>EDIT:
  These are my routes</p>
  
  <pre><code>//AppComponent
  @Routes([
      { path: '/admin-login', component: AdminLoginLayoutComponent },
      { path: '/admin', component: AdminLayoutComponent },
      { path: '/edit', component: EditReportLayoutComponent },
      { path: '/', component: WebLayoutComponent },
  ])
  
  //WebLayoutComponent
  @Routes([
      { path: '/details/:id', component: DetailsComponent },
      { path: '/applications', component: ApplicationsComponent },
      { path: '/statistics', component: StatisticsComponent },
      { path: '/addreport', component: NewReportComponent },
      { path: '/register', component: RegisterComponent },
      { path: '/account', component: AccountComponent },
      { path: '/login', component: LoginComponent },
      { path: '/feed', component: AllFeedComponent },
      { path: '/', component: MapComponent }
  ])
  </code></pre>
  
  <p>EDIT: Added a minimum example on plunker <a href="http://plnkr.co/edit/4TAd436l91zGX2emsxEF?p=preview" rel="nofollow">http://plnkr.co/edit/4TAd436l91zGX2emsxEF?p=preview</a></p>