javascript - Hur får man event.target som ett objekt i Angular 2?


Först och främst, jag ber om ursäkt för min bristfälliga engelska.

.

Jag vill skriva kod så att om man klickar någonstans utom på .do-not-click-here, anropas myFunction().

Så jag skrev kod som nedan.

document.addEventListener('click', (event) => {
  if(event.target.classList.includes('do-not-click-here')) {
    myFunction();
  }
)

Men denna kod returnerar felet "Property 'classList' finns inte på typen 'EventTarget'."

.

Så jag försökte felsöka genom console.log.

.

När jag försökte console.log(event);

mottog event.target som ett JavaScript-objekt. (Jag vill ha det)

.

När jag försökte console.log(event.target);

mottog event.target som ett element(?). så event.target.classList fungerar inte. (Kanske)

.

Hur får man event.target.classList?

eller finns det ett bättre sätt än jag trodde för jag ville?

Svar #1

Andra svar är bra, detta är bara ett alternativ i en mer angular-stil. Du kan skapa en global klicklyssnare i någon av dina komponenter på detta sätt:

@HostListener('document:click', ['$event.target'])
onClick(element: HTMLElement) {
    if(element.classList.contains('do-not-click-here')) {
        myFunction();
    }
}

Relaterade artiklar