angular 2 events example

For example, the component class and HTML template as given below.

import {Component} from 'angular2/core';

@Component({

    selector: 'myApp'

    templateUrl: '<div><button (click)="myClicked()">ClickMe</button></div>'

})

class MyComponent {

        myClicked() {

        }

 }

export class myApp_Component { }

The HTML template as given below.

<button (click)="myClicked()">ClickMe</button>

In the above, the myClicked() method will be called after clicked on button and we can also capture the event object using $event as parameter. i.e.

<button (click)="myClicked($event)">ClickMe</button>

and also in component class

class MyComponent {

        myClicked(event) {

        }

 }

In the below live demo example, you can see the and click to toggle button