Angular 8 - Tutorial | Event Binding #11

In this video we will understand event binding in angular with example
Till now what we have discussed in previous videos
- interpolation
- property binding
- class binding
- style binding
this binding flows the data in one direction that is from
comonent class to an html property
when we have a web form we will have a variety of controles on that
web form for example we have textbox, button, drop down list, images
Etcetera
when user visits a web form he will perform variety of action
he can click a button select from a drop down list
insert into a textbox, hovoring over images, submit a form
when user perform these actions their corresponding events raised
and when these events raised we need to capture this events and notify
to component so that we can react to those event
so in simple we can say event binding flow the data in opposite
direction form html element to a component
-------------------------------------------
sometimes we might want the information about event itself.
for example you need the information about the click event
$event is a special variable in angular it gives all
the information about the DOM event that was raised
now we are passing the parameter to handlerFunction() method
so lets define inside .ts file to receive event information
so by using the $event you can get access to all the property
of DOM event
----------------------------
sometimes you work with event binding a separate event handler
may not be necessary.
Type the code to be executed right inside the html template
-----------------------------------
// Full list of Angular Events
(click)="myFunction()"
(dblclick)="myFunction()"
(submit)="myFunction()"
(blur)="myFunction()"
(focus)="myFunction()"
(scroll)="myFunction()"
(cut)="myFunction()"
(copy)="myFunction()"
(paste)="myFunction()"
(keyup)="myFunction()"
(keypress)="myFunction()"
(keydown)="myFunction()"
(mouseup)="myFunction()"
(mousedown)="myFunction()"
(mouseenter)="myFunction()"
(drag)="myFunction()"
(drop)="myFunction()"
(dragover)="myFunction()"
-----------------------------------------
Angular 8 2020 | Introduction to Angular
https://youtu.be/kydPq4r2vbE
Angular 8 2020 | Angular Project Setup #2
https://youtu.be/zsb4vYFf1eI
Angular 8 2020 | Workspace vs File Structure of Angular #3
https://youtu.be/1ukJR6te398
Angular 8 2020 | Single Page Application vs Multi page Application #4
https://youtu.be/jA7Xvw1JNw4
Angular 8 2020 | Complete architecture Overview #5
https://youtu.be/lRTaT74OUic
Angular 8 2020 | What is Component in Angular Application #6
https://youtu.be/5BFeKxGyFdg
Angular 8 2020 | Interpolation #7
https://youtu.be/egNDI8nN8Og
Angular 8 2020 | Property binding #8
https://youtu.be/f9BNLAENCIs
Angular 8 - tutorial | Class Binding #9
https://youtu.be/MKkv9oHDHXQ
#angular #event_binding

Видео Angular 8 - Tutorial | Event Binding #11 канала Technical Babaji