How to trigger multiple outlets with one routerLink in angular2 (2.1.1)

Question

I'd like to swap out components in 2 separate areas of the DOM when I select a routerLink element. How can I route a single routerLink to 2 <router-outlet> s and designate a unique component for each <router-outlet> ?

I'd like something like this:

<div id="region1>
  <a routerLink="/view1" routerLinkActive="active">View 1</a>
  <a routerLink="/view2" routerLinkActive="active">View 2</a>

  <!-- First area to swap -->
  <router-outlet name="sidebar"></router-outlet>

<div>

<div id="region2>
  <!-- Second area to swap -->
  <router-outlet name="mainArea"></router-outlet>
<div>    

routes

const routes: Routes = [
  { path: '', redirectTo: 'view1', pathMatch: 'full'},
  { path: 'view1', {
    outlets : 
      [
       //one path specifies 2 components directed at 2 `router-outlets`
       component: View1Sidebar, outlet : 'sidebar'
       component: View1mainArea, outlet : 'mainArea'
      ]
    }
  },
  { path: 'view2', {
    outlets : 
      [
       component: View2Sidebar, outlet : 'sidebar'
       component: View2mainArea, outlet : 'mainArea'
      ]
    }
  },
];

Answer 1

This cannot be done exactly as you ask. The purpose of a router is to maintain information about the specific page.

If you want to show and hide any components without reflecting any route information then you'll want to use the *ngIf directive. To use it like this, you'll need to keep a variable in you application somewhere that can be used to trigger the *ngIf directive.

You can make use any type of data, but you need to pass it to the *ngIf statement in the form of a boolean or expression that resolves to a boolean: here are examples"

component

showComponentBool: boolean = true;
showComponentStr: string = 'show';

html

<div *ngIf="showComponentBool">
  <div *ngIf="showComponentStr='show'"></div>
</div>

Answer 2

With "@angular/core": "^4.0.0"

<a [routerLink]="[{ outlets: { primary: 'contact', aux: 'aside' }}]">Contact + Aux</a>

https://stackoverflow.com/a/42558766/2536623