title: How to Use Child Routing to Populate the Parent's RouterOutlet in Angular 2
body: <p>The home page of my app is just</p>
  
  <pre><code>&lt;router-outlet&gt;&lt;/router-outlet&gt;
  </code></pre>
  
  <p>and the class looks something like this:</p>
  
  <pre><code>@RouteConfig([
      {path:'/', name: 'StartScreen', component: StartScreen, useAsDefault: true}
  ])
  
  export class AppHome {
      constructor(private router: Router) {}
  }
  </code></pre>
  
  <p>Which gets populated by a default route for the start screen, which contains a search box. This part worked until I wanted to do more... </p>
  
  <p>By clicking search, it triggers this function in the start screen class:</p>
  
  <pre><code>@RouteConfig([
      {path:'/...', name: 'Results', component: Results}
  ])
  
  
  export class StartScreen{
      private router : Router
  
      constructor(router: Router)
          this.router = router;
      }
  
      search(input) {
          this.data.search(input);
          this.router.parent.navigate(['Results']);
      }
  }
  </code></pre>
  
  <p>The start screen does not have it's own RouterOutlet. I actually want the "Results" template to replace the start screen and populate the home page's RouterOutlet. </p>
  
  <p>Am I on the right track and my problems are due to other syntax errors, or I'm going about it incorrectly?</p>