Что такое Data Binding в Angular

Ответ

Data Binding в Angular — это механизм синхронизации данных между компонентом и шаблоном. Есть 4 типа:

  1. Интерполяция {{value}} — одностороннее связывание из компонента в шаблон
  2. Property binding [property]="value" — привязка свойства DOM к данным компонента
  3. Event binding (event)="handler()" — реакция на события DOM
  4. Two-way binding [(ngModel)]="property" — синхронизация в обе стороны

Пример:

<!-- Интерполяция -->
<p>{{ title }}</p>

<!-- Property binding -->
<img [src]="imageUrl">

<!-- Event binding -->
<button (click)="onClick()">Click</button>

<!-- Two-way binding -->
<input [(ngModel)]="username">

Two-way binding требует FormsModule. Data Binding упрощает работу с DOM, автоматически обновляя представление при изменении данных.