Maler og databinding

Interpolasjon lar deg sette inn verdier fra komponenten i HTML-en. Bruk doble krøllparenteser for å vise data:

{{ data }}

{{ username }}

Property binding lar deg angi egenskaper for HTML-elementer dynamisk:

[src] = "imageUrl"

<img [src]="user.profilePicture">

Hendelsesbinding lar applikasjonen reagere på brukerhandlinger:

(click)="onClick()"

<button (click)="showAlert()">Click me</button>

Toveis databinding holder brukergrensesnittet og dataene synkronisert. Bruk [(ngModel)]:

<input [(ngModel)]="user.name">

Strukturelle direktiver endrer layouten i DOM-en. Eksempler er *ngIf og *ngFor.

<div *ngIf="isVisible">Visible Content</div>

*ngFor går gjennom data og viser elementer gjentatte ganger:

<li *ngFor="let item of items">{{ item }}</li>

Du har lært å bruke maler og databinding til å opprette dynamiske Angular-visninger!