Here is my component's template
<input #emailId (focusout)="emailIdCheck(emailId.value)" #emailIDD (keydown.tab)="emailIdCheck(emailIDD.value)" type="text" placeholder="Your Email ID">
As you can see I have bound the focusout
event as well as keydown.tab (tab keydown)
event to a method in my component class.
But this looks ugly and does not scale well if I want to bind a number of events.
Is there a possibility to have something like the below?
<input #emailId (focusout|keydown.tab)="emailIdCheck(emailId.value)" type="text" placeholder="Your Email ID">
Disclaimer: I started practicing angular2 couple of weeks back and am still new
After realizing this, I wanted to see if you could arbitrarily bind to the same event several times. Turns out, you totally can. Run this demo in my JavaScript Demos project on GitHub. In Angular 1.
The $event object often contains information the method needs, such as a user's name or an image URL. The target event determines the shape of the $event object. If the target event is a native DOM element event, then $event is a DOM event object, with properties such as target and target.
Adding two-way data bindinglink Angular's two-way binding syntax is a combination of square brackets and parentheses, [()] . The [()] syntax combines the brackets of property binding, [] , with the parentheses of event binding, () , as follows.
Angular includes $event that contains the information about an event. The type of $event depends on the target event, e.g., if the target event is a native DOM element event, then it is an object. A component should define the onShow(event) method where the type of the parameter can be KeyboardEvent, MouseEvent, etc.
https://github.com/angular/angular/issues/6675
Oct 3 2016
not planned in a near future
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With