Powiązanie wartości z właściwościami elementów DOM w Angular

W Angularze rozróżnia się dwa typy powiązań wartości z tagami: z atrybutem tagu i z właściwością elementu DOM. Z reguły jest to to samo, ale czasami ma to znaczenie.

Przyjrzyjmy się tym dwóm sposobom na przykładach. Załóżmy, że mamy następującą właściwość klasy:

app/app.component.tsexport class AppComponent {
  public text: string = 'abcde';
}

Wyprowadźmy wartość tej właściwości w tekst textarea

app/app.component.html<textarea>{{ text }}</textarea>

A teraz w atrybut placeholder:

app/app.component.html<textarea placeholder="{{ text }}"></textarea>

A teraz zapiszmy dane właśnie we właściwość elementu DOM. W tym celu nazwę atrybutu weźmiemy w nawiasy kwadratowe:

app/app.component.html<textarea [value]="text"></textarea>