From 3a7beb93826c1cb3012270401ce7f11d188f43fa Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Wed, 24 Apr 2019 05:06:55 +0200
Subject: [PATCH] refactor(menu): change menu item host listeners so they can
 be safely inherited (#15871)

[Based on the discussion here](https://github.com/angular/material2/pull/15857/files#r277058391). Reworks the host listeners in `MatMenuItem` so that extending it works properly both in ViewEngine and Ivy.
---
 src/lib/menu/menu-item.ts | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/lib/menu/menu-item.ts b/src/lib/menu/menu-item.ts
index d97367b69ab..1ae19cd806c 100644
--- a/src/lib/menu/menu-item.ts
+++ b/src/lib/menu/menu-item.ts
@@ -16,6 +16,7 @@ import {
   Inject,
   Optional,
   Input,
+  HostListener,
 } from '@angular/core';
 import {
   CanDisable, CanDisableCtor,
@@ -50,8 +51,6 @@ export const _MatMenuItemMixinBase: CanDisableRippleCtor & CanDisableCtor & type
     '[attr.tabindex]': '_getTabIndex()',
     '[attr.aria-disabled]': 'disabled.toString()',
     '[attr.disabled]': 'disabled || null',
-    '(click)': '_checkDisabled($event)',
-    '(mouseenter)': '_handleMouseEnter()',
   },
   changeDetection: ChangeDetectionStrategy.OnPush,
   encapsulation: ViewEncapsulation.None,
@@ -129,6 +128,12 @@ export class MatMenuItem extends _MatMenuItemMixinBase
   }
 
   /** Prevents the default element actions if it is disabled. */
+  // We have to use a `HostListener` here in order to support both Ivy and ViewEngine.
+  // In Ivy the `host` bindings will be merged when this class is extended, whereas in
+  // ViewEngine they're overwritte.
+  // TODO(crisbeto): we move this back into `host` once Ivy is turned on by default.
+  // tslint:disable-next-line:no-host-decorator-in-concrete
+  @HostListener('click', ['$event'])
   _checkDisabled(event: Event): void {
     if (this.disabled) {
       event.preventDefault();
@@ -137,6 +142,12 @@ export class MatMenuItem extends _MatMenuItemMixinBase
   }
 
   /** Emits to the hover stream. */
+  // We have to use a `HostListener` here in order to support both Ivy and ViewEngine.
+  // In Ivy the `host` bindings will be merged when this class is extended, whereas in
+  // ViewEngine they're overwritte.
+  // TODO(crisbeto): we move this back into `host` once Ivy is turned on by default.
+  // tslint:disable-next-line:no-host-decorator-in-concrete
+  @HostListener('mouseenter')
   _handleMouseEnter() {
     this._hovered.next(this);
   }
@@ -164,4 +175,3 @@ export class MatMenuItem extends _MatMenuItemMixinBase
   }
 
 }
-