Angular EventListener for mousemove event only fires on CLICK, but not on MOVE-CodePudding

Whenever I move the mouse over my website, I want to log out the current cursor position.

Here is a stackblitz. Try running the website and then click in the screen, it will produce a log. But not when you just move the mouse.

this is how I start listening to the mouse move:

@HostListener('document:mousemove', ['$event']) documentClickEvent($event: MouseEvent) {
  console.log('Through HostListener - MouseMove Event Details: ', $event)
}

CodePudding user response：

The stackblitz that you linked shows this:

@HostListener('document:click', ['$event']) documentClickEvent($event: MouseEvent) {
    console.log('Through HostListener - Click Event Details: ', $event)
}

The HostListener is listening to click events, so your logging will only be triggered by clicking on the screen.

I copied the code snippet you have in your post (so that HostListener is listening to document:mousemove), and that triggered the logging on moving the mouse as expected.