Angular 2 - List of events Angular 2 - List of events angular angular

Angular 2 - List of events


The default handled events should be mapped from the original HTML DOM component's events:

http://www.w3schools.com/jsref/dom_obj_event.asp

by just removing the on prefix.

onclick ---> (click)

onkeypress ---> (keypress)

etc...

You can also create your custom events.

However ngInit is not an HTML event, this is part of the Angular's Component lifecycle, and in Angular 2 they are handled using "hooks", which are basically specific method names inside your component that will be called whenever the component enters the specific cycle. Like:

ngOnInit

ngOnDestroy

etc...


Here is the list of events in Angular Please check in the documentation if required for more info

(focus)="myMethod()"(blur)="myMethod()" (submit)="myMethod()"  (scroll)="myMethod()"(cut)="myMethod()"(copy)="myMethod()"(paste)="myMethod()"(keydown)="myMethod()"(keypress)="myMethod()"(keyup)="myMethod()"(mouseenter)="myMethod()"(mousedown)="myMethod()"(mouseup)="myMethod()"(click)="myMethod()"(dblclick)="myMethod()"(drag)="myMethod()"(dragover)="myMethod()"(drop)="myMethod()"


This is one of the big advantages of Angular2. Not every event needs a customized ng-xxx directive anymore.
With custom elements and all other libraries producing all kinds of custom events, this approach doesn't fly.

In Angular2 the (eventName)="expression" binding syntax allows to subscribe to any known and unknown event.

The $event variable is still available (eventName)="myEventHandler($event)"

See also https://angular.io/docs/ts/latest/guide/template-syntax.html#!#event-binding