Rax Weber
Rax Weber

Reputation: 3780

Get element with attached event binding in Angular2

I want to get the element with the (click) event binding:

<th class="ui-state-default ui-unselectable-text ui-sortable-column" (click)="reorderComponents($event)">
  <span class="ui-column-title">Component Name</span>
  <span class="ui-sortable-column-icon fa fa-fw fa-sort {{compSortIcon}}"></span>
</th>

As you can see, it is the <th> element. However, after clicking and logging the event object, it shows this:

enter image description here

enter image description here

I want to get the <th> element, but sadly I couldn't find a solution yet.

Upvotes: 0

Views: 200

Answers (2)

yurzui
yurzui

Reputation: 214007

Use event.currentTarget

reorderComponents(event) {
  console.log(event.currentTarget);
}

It always refers to the element to which the event handler has been attached, as opposed to event.target which identifies the element on which the event occurred.

Plunker Example

Upvotes: 4

Ashish Kadam
Ashish Kadam

Reputation: 1487

I hope this help you.

reorderComponents(event){
   console.log(event.toElement.nodeName)
}

Upvotes: 0

Related Questions