title: How to focus input element when Menu is opened?
body: <p><a href="https://i.stack.imgur.com/Zoc8O.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Zoc8O.png" alt="enter image description here"></a></p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;button mat-button id="categories-button" [mat-menu-trigger-for]="categoryList"&gt;
    &lt;span&gt;categories&lt;/span&gt;
    &lt;mat-icon id="drop-arrow"&gt;arrow_drop_down&lt;/mat-icon&gt;
  &lt;/button&gt;
  &lt;mat-menu #categoryList&gt;
    &lt;mat-form-field appearance="standard" id="category-search-wrapper"&gt;
      &lt;input (click)="$event.stopPropagation()" matInput id="category-search"&gt;
    &lt;/mat-form-field&gt;
  
    &lt;button mat-menu-item&gt;Settings&lt;/button&gt;
    &lt;button mat-menu-item&gt;Help&lt;/button&gt;
  &lt;/mat-menu&gt;
  </code></pre>
  
  <p>I want <code>category-search</code> input to be focused, when Menu is opened, the problem is it doesn't seem to be ready yet, when menuOpened event is emitted. How can I focus input element when Menu is opened?</p>