Event Binding

• Event binding is the process of capturing and responding to user interactions with your web application. 
• These interactions can range from a simple click on a button to more complex actions like mouse movements and keyboard inputs. 
• Event binding in Angular allows you to define what happens when a user interacts with elements in your application.

Example:

<div style="text-align: center;">
    <h1>
        Welcome to {{title}}
    </h1>
</div>
<div>Days:
    <select (change)="changemonths($event)">
        <option *ngFor="let i of days">{{i}}</option>
    </select>
</div>
<button (click) = "myClickFunction($event)">Click Me</button>

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'Quipoin!!';
  days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"
  ];
  changemonths(event) {
    console.log("days changed from the dropdown!!");
    console.log(event);
  }
  myClickFunction(event) {
    alert("Button is Clicked!!");
    console.log(event);
  }
}

Output: