Quais são os tipos de ligação de dados existentes no Angular?

No Angular, existem os seguintes tipos de ligação de dados:

1. Ligação unidirecional da fonte para a vista (One-Way Data Binding: Componente para DOM): As alterações no componente refletem-se na vista (HTML).

   • Ligação por interpolação (Interpolation): Exibir os valores das propriedades do componente.

     <p>{{ propriedadeComponente }}</p>
     

   • Ligação de propriedades (Property Binding): Definir os valores das propriedades dos elementos DOM.

     <img [src]="urlImagem">
     

2. Ligação unidirecional da vista para a fonte (One-Way Data Binding: DOM para Componente): As alterações na vista (eventos do utilizador) afetam as propriedades do componente.

   • Ligação de eventos (Event Binding): Gerir eventos de elementos DOM.

     <button (click)="lidarComClique()">Clica em mim</button>
     

3. Ligação bidirecional (Two-Way Data Binding): As alterações no componente e na vista afetam-se mutuamente em simultâneo.

   • Utiliza a sintaxe [()].

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

   • Requer importar FormsModule para ngModel.