title: Angular2 RC5 | Router: Cannot match any routes
body: <p>I am currently using Angular 2 - RC5 with the router 3.0.0 RC1. This seems to be a pretty common error, but I can't find any solution that works. My component structure includes a "BasicContentComponent" which includes the main menu and the header and an aux outlet for the content of the child route. The "BasicContentComponent" comes from a shared module and the child routes component from specific module of that child route.</p>
  
  <p>My route configuration looks like this</p>
  
  <pre><code>export const routeConfig = [
      {
          path: 'home',
          component: BasicContentComponent,
          children: [
              {
                  path: '',
                  component: HomeContainer,
                  //canActivate: [IsAuthenticatedGuard],
                  outlet: 'content', // REMOVE THIS LINE
                  //resolve: {
                  //    homeState: HomeResolver
                  //}
              }
          ]
      }
  ];
  </code></pre>
  
  <p>If I remove the "children" definition I am able to load "/home" but with this configuration I get the error.</p>
  
  <p>Following are the module configurations, since the problem may also lie there.</p>
  
  <p><strong>app.module.ts</strong></p>
  
  <pre><code>@NgModule({
    declarations: [
      AppComponent
    ],
    imports: [
      BrowserModule,
      FormsModule,
      HttpModule,
  
      RouterModule.forRoot(routeConfig), //see above
      SharedModule.forRoot(),
      HomeModule
    ],
    bootstrap: [AppComponent]
  })
  export class AppModule {}
  </code></pre>
  
  <p><strong>shared.module.ts</strong></p>
  
  <pre><code>import { Store, StoreModule } from '@ngrx/store';
  
  @NgModule({
      imports: [
          RouterModule,
          CommonModule,
          ...
  
          StoreModule.provideStore(reducers),
      ],
      declarations: [
          BasicContentComponent,
          ...
      ],
      exports: [BasicContentComponent, ...],
  
  })
  export class SharedModule {
  
      static forRoot() : ModuleWithProviders {
          return {
              ngModule: SharedModule,
              providers: [
                  MdIconRegistry,
                  ...
                  IsAuthenticatedGuard,
                  ...
                  HomeResolver
              ]
          }
      }
  }
  </code></pre>
  
  <p><strong>home.module.ts</strong></p>
  
  <pre><code>@NgModule({
      imports: [CommonModule, SharedModule],
      declarations: [
          HomeContainer,
          HomeComponent
      ],
      exports: [HomeContainer]
  })
  export class HomeModule { }
  </code></pre>
  
  <p>I get the following error</p>
  
  <blockquote>
    <p>browser_adapter.js:84 EXCEPTION: Error: Uncaught (in promise): Error:
    Cannot match any routes: 'home'</p>
  </blockquote>
  
  <p>Any idea what the problem could be? Is it a route config or a modules issue? thanks</p>
  
  <p><strong>Edit</strong>
  I forgot the templates:</p>
  
  <p><strong>app.component.html</strong></p>
  
  <pre><code>&lt;div&gt;
    &lt;router-outlet&gt;&lt;/router-outlet&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>basic-content.component.html</strong></p>
  
  <pre><code>&lt;md-sidenav-layout fullscreen&gt;
    &lt;md-sidenav mode="side" align="start" [opened]="isOpened$ | async" color="warn"&gt;
      &lt;mainnav-container&gt;&lt;/mainnav-container&gt;
    &lt;/md-sidenav&gt;
  
    &lt;page-header-container&gt;&lt;/page-header-container&gt;
  
    &lt;div class="app-content"&gt;
      &lt;router-outlet name="content"&gt;&lt;/router-outlet&gt; // REMOVE NAME
    &lt;/div&gt;
  
  &lt;/md-sidenav-layout&gt;
  </code></pre>