在Angular中，可以使用@HostListener装饰器来监听宿主元素的事件。下面是一个示例：

首先，在组件类中导入@HostListener装饰器：

import { Component, HostListener } from '@angular/core';

然后，在组件类中定义一个方法，并使用@HostListener装饰器来监听宿主元素的事件：

@Component({
  selector: 'app-my-component',
  template: `
My Component
`,
  styles: [`div { width: 200px; height: 200px; background-color: yellow; }`]
})
export class MyComponent {
  @HostListener('mouseenter') onMouseEnter() {
    console.log('Mouse entered');
  }

  @HostListener('mouseleave') onMouseLeave() {
    console.log('Mouse left');
  }
}

在上面的例子中，我们定义了两个方法onMouseEnter和onMouseLeave，分别使用@HostListener装饰器来监听宿主元素的mouseenter和mouseleave事件。当鼠标进入和离开宿主元素时，对应的方法将会被调用，并输出相应的消息到控制台。

最后，在模板中使用这个组件：

当鼠标进入和离开app-my-component元素时，相应的消息将会被输出到控制台。

这就是使用@HostListener装饰器来监听宿主元素事件的解决方法。