Zmienne szablonowe w Angular
W Angular można uzyskać dostęp do tagów
strony za pomocą zmiennych szablonowych.
Pozwalają one powiązać tag ze zmienną
i odnosić się do niego podczas pracy
komponentu. Aby zadeklarować taką
zmienną, należy przed jej nazwą postawić
znak #.
Spójrzmy na praktyce. Załóżmy, na przykład, że mamy div. Zapiszmy go w zmiennej szablonowej:
<div #userName>
text
</div>
Teraz w zmiennej userName będzie
znajdować się referencja do DOM elementu naszego div.
I możemy się do niej odnosić tak, jak to
się robi w czystym JavaScript.
Na przykład, wypiszmy tekst tego div
w innym tagu:
<div>
{{ userName.textContent }}
</div>
Dany div. Dany obrazek. Zapisz referencję
do obrazka w zmiennej szablonowej. Wyświetl
src naszego obrazka wewnątrz div.