Mik a különbségek az Angular különböző adat kötési típusai között?

Angularban különböző adatkapcsolási típusok léteznek, amelyek lehetővé teszik az adatok összekapcsolását a komponens és a sablon között:

• Tulajdonság kötés (Property Binding): összekapcsolja egy DOM elem tulajdonságát a komponens kifejezésével. Egyirányú — az adatok a komponensből a sablonba mennek.

  <img [src]="imageUrl">
  

• Esemény kötés (Event Binding): összekapcsol egy DOM eseményt a komponensben lévő kezelővel. Lehetővé teszi a felhasználói műveletekre való reagálást.

  <button (click)="onClick()">Kattints rám</button>
  

• Kétirányú kötés (Two-way Binding): kombinálja a property és az esemény kötést, hogy szinkronizálja az adatokat a komponens és a sablon között. A [(ngModel)] szintaxissal használható.

  <input [(ngModel)]="username">
  

• Interpolláció (Interpolation): beszúrja a komponens értékét szövegként a sablonba.

  <p>{{ username }}</p>
  

A fő különbség az adatátvitel irányában és céljában van: property binding — a komponensből a sablonba, event binding — a sablonból a komponensbe, kétirányú kötés — mindkét irányban szinkronizál.