ADVERTISEMENTS

How to bind event with angular

In Angular, we can bind events to elements in a template using event binding. Event binding allows you to specify a method in component's code that should be called when a specific event occurs on an element in the template. The basic syntax for event binding is to use parentheses around the event want to listen for, and then specify the component method that should be called when the event occurs.

The following example will explain that we have a button in template that we want to bind on a click event with pass event-specific data to the component method using the $event object. You can easily copy it and use with your own code.

<button (click)="bndMethod()">Click me</button>

Here, bndMethod is the method that should be called when the button is clicked. We can also pass event-specific data to the component method using the $event object. For example, you can pass the value of an input field to the component method when the input's value changes by using the following syntax:

<button (click)="bndMethod()">Click me</button>
Supported Browsers:
  • Internet Explorer
  • Mozilla Firefox
  • Google Chrome
  • Opera
  • Safari

Angular is a javaScript framework for building single page web applications. You can learn angular from our Angular Tutorials and Angular Examples

ADVERTISEMENTS