title: Angular 6 - multiple router outlets
body: <p>I want to have an Enter-comp. as overview and basically two child-comp. For instance a login- and register-comp. Furthermore I want to manage this with multiple router outlets. But "of course" it doesnt work yet. It keeps me throwing: <code>Error: Cannot match any routes. URL Segment: ',%20%7Boutlets:%20%7Blogin:%20%5B'login'%5D%7D%7D'</code></p>
  
  <h2>App routing config</h2>
  
  <pre><code>const routes: Routes = [
    {path: 'stories', component: StoriesComponent},
    {path: '', component: EnterOverviewComponent, children: [
        {path: 'login', component: LoginComponent, outlet: 'login'},
        {path: 'register', component: RegisterComponent, outlet: 'register'},
      ]}
  ];
  </code></pre>
  
  <h2>App-root</h2>
  
  <pre><code>&lt;app-navbar&gt;&lt;/app-navbar&gt;
  
  &lt;router-outlet&gt;&lt;/router-outlet&gt;
  &lt;router-outlet name="login"&gt;&lt;/router-outlet&gt;
  &lt;router-outlet name="register"&gt;&lt;/router-outlet&gt;
  </code></pre>
  
  <h2>Navbar comp.</h2>
  
  <p>Expecting the error here. I suspect, that I call the false route:</p>
  
  <pre><code>&lt;ul class="navbar-nav ml-auto"&gt;
    &lt;li class="nav-item" routerLinkActive="active"&gt;
      &lt;a class="nav-link" routerLink="/, {outlets: {login: ['login']}}"&gt;Sign In&lt;/a&gt;
    &lt;/li&gt;
    &lt;li class="nav-item" routerLinkActive="active"&gt;
      &lt;a class="nav-link" routerLink="/, {outlets: {register: ['register']}}"&gt;Register&lt;/a&gt;
    &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>