角2，如何动态绑定和取消绑定mousemove事件

Question

我知道如何使用HostListener装饰像这样绑定到事件：

@HostListener('document:mousemove', ['$event']) 
    onMousemove(event) { 
    //Some code on mouse movement. 
    } 

但我想是能够结合并取消绑定鼠标移动事件在组件的整个生命周期中间歇性地发生。我不知道这种类型的绑定被称为什么，我什么都找不到。我应该尝试使用原生JavaScript事件绑定吗？

Answer 1

定义如下的输出变量。

@Output() mouseEvent = new EventEmitter(); 

当你想发出像下面这样的事件时使用这个变量。

<div (mouseover)="someOverFunction()" 
    (mouseleave)="someLeaveFunction()"> 
     <span *ngIf="mouseOverDiv == true">hello mouseover</span> 
     <span *ngIf="mouseOverDiv == false">hello mouseleave</span> 
</div> 

TS：要在HTML元素添加

<HTMLElement (mouseEvent) = "methodName()"></HTMLElement> 

Answer 2

HTML

this.mouseEvent.emit({value:paramValue}); 

调用鼠标事件

mouseOverDiv : boolean = false; 

someOverFunction(){ 
this.mouseOverDiv = true; 
} 

someLeaveFunction(){ 
this.mouseOverDiv = false; 
}