Angular Event Binding

A third type of binding in Angular is event binding. This allows the component to react to raised html events. For example, you can have a button that once it is clicked, it calls a function in the component class. To use event binding, parentheses are utilized. Here is an example…

export class AppComponent {
    addDessert() {
        console.log('Dessert Added');

Now we can call this function from the component template…

<h1>Desserts I want...</h1>
<button (click) = 'addDessert()'>
    Add Dessert

Share this post

Share on facebook
Share on google
Share on twitter
Share on linkedin
Share on pinterest
Share on print
Share on email
Skip to content