Šablónové premenné v Angular

V Angular je možné získať prístup k elementom stránky pomocou šablónových premenných. Umožňujú viazať element na premennú a odkazovať sa naň počas práce komponentu. Na to, aby sme deklarovali takúto premennú, musíme pred jej názov umiestniť znak #.

Pozrime sa na to v praxi. Nech máme, napríklad, div. Zapíšme ho do šablónovej premennej:

app/app.component.html<div #userName>
  text
</div>

Teraz bude v premennej userName odkaz na DOM element nášho divu. A môžeme s ním zaobchádzať tak, ako to robíme v čistom JavaScripte. Napríklad, vypíšme text tohto divu v inom elemente:

app/app.component.html<div>
  {{ userName.textContent }}
</div>