title: Access element over the router-outlet Angular 6
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;side-nav [navTitle]="navTitle"&gt;&lt;/side-nav&gt;
  &lt;router-outlet&gt;
  
  &lt;/router-outlet&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I  have navigation bar at the root component. I created <code>[navTitle]</code> with <code>@Input</code> Decorator inside the <code>side-nav</code> component. <code>side-nav</code> component is placed in another component(<code>root-component</code>). However I want access <code>[navTitle]</code> and change from component which loaded inside the router-outlet acording to which component is loaded. How do I achieve that?</p>