Привязка обработчиков событий в темплейте Angular

В Angular обработчики событий привязываются к тегам особым образом - с помощью атрибутов. В круглых скобках указывается имя события, а в значении атрибута вызывается метод класса компонента, который должен выполнится по этому событию.

Для примера давайте сделаем так, чтобы по клику на кнопку выполнился метод show класса компонента:

app/app.component.html<button (click)="show()">
  button
</button>

Напишем теперь реализацию метода show в классе компонента:

app/app.component.tsexport class AppComponent {
  public show(): void {
    alert('test');
  }
}