Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Angular 11 – HostListener event listen for ctrl + mouse left click?

Is there a way to listen for ctrl + left mouse click event.

I’m able to capture the ctrl click but how do i combine it with the left mouse click.

 @HostListener('document:keyup', ['$event'])
    handleKeyboardEvent(event: KeyboardEvent) {
    console.log(event.key)
    if (event.key == 'Control'){
      console.log(true)
     }
    }

this is what I have for the ctrl click.
Thank you.

Tags:

2

Answers


  1. 0

    event.key == 'Control' checks is control pressed as separate event. You need event.ctrlKey whick is boolean and represents whether control been pressed during the event (in your case click) or not. So just listen click event, and when it is triggered check if(event.ctrlKey)

    Login or Signup to reply.
  2. 0

    You can check if the CTRL Key is pressed or not from event.ctrlKey

    
@Directive({ selector: '[wtCtrlClickDirective]', standalone: true })
export class CtrlClickDirective {

  @HostListener('click', ['$event'])
  ctrlClickEventHandler(event: MouseEvent) {

    if (event.ctrlKey) {

      console.log('CTRL + Left Click');

    } else {

      console.log('Just click');

    }

  }
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search