Angular 4: Data Binding Event Binding

When an event occurs i.e. clicking a button we want a function onButton() to be called.

In app.component.ts we have the function onButton() which simply logs a few words to the console,

export class AppComponent {
onButton(){
   console.log("You pressed it, well done!")
   }
}

In app.component.html the event, in this case ‘click’, is in round brackets,

<button class="btn btn-primary" (click)="onButton()">Button</button>