title: Angular Material: How to toggle sidenav when the trigger is in a different component
body: <p>how do I toggle the sidenav from  another component?</p>
  
  <p>When the button/trigger is in the same .html file as the sidenav, it work just fine, but if I generate a new component, in my case I named them "sidebar-left" and "topbar," it don't work.</p>
  
  <p>What I did is I generated components to separate them. I put the sidenav in the "sidebar-left" component and the button/trigger in "topbar" component.</p>
  
  <p><strong>sidebar-left.component.html</strong></p>
  
  <pre><code>&lt;mat-sidenav-container&gt;
  
      &lt;mat-sidenav #sidenav mode="side" [(opened)]="opened" opened&gt;
          &lt;h3&gt;Sidenav&lt;/h3&gt;
      &lt;/mat-sidenav&gt;
  
      &lt;mat-sidenav-content&gt;
          &lt;app-dashboard&gt;&lt;/app-dashboard&gt;
      &lt;/mat-sidenav-content&gt;
  
  &lt;/mat-sidenav-container&gt;
  </code></pre>
  
  <p><strong>topbar.component.html</strong></p>
  
  <pre><code>&lt;mat-toolbar&gt;
      &lt;button (click)="sidenav.toggle()" mat-raised-button&gt;Toggle Sidenav&lt;/button&gt;
  &lt;/mat-toolbar&gt;
  </code></pre>
  
  <p>I would like to be able to trigger the sidenav no matter where I trigger it inside the application.</p>
  
  <p>And when I do hit the toggle button, I'm having this error:</p>
  
  <pre><code>TopbarComponent.html:1 ERROR TypeError: Cannot read property 'toggle' of undefined
      at Object.eval [as handleEvent] (TopbarComponent.html:2)
      at handleEvent (core.js:43993)
      at callWithDebugContext (core.js:45632)
      at Object.debugHandleEvent [as handleEvent] (core.js:45247)
      at dispatchEvent (core.js:29804)
      at core.js:42925
      at HTMLButtonElement.&lt;anonymous&gt; (platform-browser.js:2668)
      at ZoneDelegate.invokeTask (zone-evergreen.js:391)
      at Object.onInvokeTask (core.js:39680)
      at ZoneDelegate.invokeTask (zone-evergreen.js:390)
  </code></pre>
  
  <p><a href="https://stackblitz.com/edit/angular-material-sidenav-2" rel="nofollow noreferrer">Here is my not-working StackBlitz code</a></p>