Angular2 multiple router-outlet in the same template

by

yes you can, but you need to use aux routing.
you will need to give a name to your router-outlet:

<router-outlet name="auxPathName"></router-outlet>

and setup your route config:

@RouteConfig([
  {path:"https://stackoverflow.com/", name: 'RetularPath', component: OneComponent, useAsDefault: true},
  {aux:'/auxRoute', name: 'AuxPath', component: SecondComponent}
])

Check out this example, and also this video.

Update for RC.5
Aux routes has changed a bit:
in your router outlet use a name:

<router-outlet name="aux">

In your router config:

{path: '/auxRouter', component: secondComponentComponent, outlet: 'aux'}

More Related Contents:

  1. Angular 2 Scroll to top on Route Change
  2. How to detect a route change in Angular?
  3. angular2: Error: TypeError: Cannot read property ‘…’ of undefined
  4. NgFor doesn’t update data with Pipe in Angular2
  5. How to determine previous page URL in Angular?
  6. How to go back last page
  7. How can I write data attributes using Angular?
  8. Angular: Cannot find a differ supporting object ‘[object Object]’
  9. OrderBy pipe issue
  10. How to get current route
  11. Angular2: Make route paths case insensitive
  12. Angular 2 – How do I navigate to another route using this.router.parent.navigate(‘/about’)?
  13. Angular2 – Redirect to calling url after successful login
  14. Angular 2: getting RouteParams from parent component
  15. Angular2 router keep query string
  16. Angular 2 Read More Directive
  17. Angular 2 passing object via route params possible?
  18. Angular2: How is ngfor expanded
  19. vs
  20. Multiple canActivate guards all run when first fails
  21. Can’t reload/refresh active route
  22. Angular 2 Dynamically insert a component into a specific DOM node without using ViewContainerRef
  23. How do I navigate to a sibling route?
  24. Angular2 routing / deep linking not working with Apache 404
  25. Pass parameter into route guard
  26. angular 2 azure deploy refresh error : The resource you are looking for has been removed, had its name changed, or is temporarily unavailable
  27. Angular2 Routing – keeping state of component when route changes [duplicate]
  28. Angular 2 disable sanitize
  29. Angular 2 different components with same route
  30. Why angular 2 ngOnChanges not responding to input array push

Leave a Comment