Angular click event on component send inner element as target

Question

I have a click event on an Angular component:

import { Component } from "@angular/core";

@Component({
  template: `
    <hello (click)="onClick($event)"></hello>
  `
})
export class AppComponent {
  onClick(e) {
    alert("Click on TAG: " + e.target.tagName);
  }
}

See demo online: https://stackblitz.com/edit/angular-ivy-zxmsnc?file=src%2Fapp%2Fapp.component.ts

Why is event.target an inner element of the component and not the component itself?

yurzui · Accepted Answer · 2021-04-13 10:07:51Z

12

That's because event.target refers to the element that triggered the event.

I think you're looking for event.currentTarget which refers to the element that the event listener is attached to.

answered Apr 13, 2021 at 10:07

yurzui

215k32 gold badges450 silver badges413 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular click event on component send inner element as target

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related