title: Mat select click outside not working, when drop down close
body: <p>I have drop down made with Mat select angular component, I need to trigger an event when I clicked outside of the drop down (body of the page).</p>
  
  <pre><code>&lt;mat-select #select multiple (change)="onSubmit($event)" [(ngModel)]="emp"&gt;
      &lt;mat-option *ngFor="let value of filter.default" [value]="value"&gt;
          {{value}}
      &lt;/mat-option&gt;
  &lt;/mat-select&gt;
  </code></pre>
  
  <p>Here is my ts file</p>
  
  <pre><code>export class AnotherComponent {
    public text: String;
  
    @HostListener('document:click', ['$event'])
    clickout(event) {
      if(this.eRef.nativeElement.contains(event.target)) {
        console.log("clicked inside");
      } else {
        console.log("clicked outside");
      }
    }
  
    constructor(private eRef: ElementRef) {
  
    }
  }
  </code></pre>
  
  <p>Its not working properly, please help</p>