title: Close Mat-menu when user scrolls the window
body: <p>Problem: Should't visible mat-menu When Window Scrolls on top of nav menu, </p>
  
  <p>Cause: it rises because of high <code>z-index</code> in <code>.cdk-overlay-container</code></p>
  
  <p>I have trailed following</p>
  
  <p><strong>file.ts</strong></p>
  
  <pre><code>@ViewChild(MatMenuTrigger) trigger: MatMenuTrigger; 
  @HostListener('window:scroll', [])
  scrollHandler() {
  if (this.trigger) {
  this.trigger.closeMenu();
   }
   }
  </code></pre>
  
  <p>But which is worked only for first mat-menu out of 6, rest not closing on scroll !!!!!</p>
  
  <p><a href="https://i.stack.imgur.com/yYMFT.png" rel="nofollow noreferrer">Angular Cli Version</a></p>