Šablonske promenljive u Angularu

U Angularu možete pristupiti tagovima stranice pomoću šablonskih promenljivih. One omogućavaju da se tag veže za promenljivu i da se na njega referencira tokom rada komponente. Da biste deklarisali takvu promenljivu, potrebno je da pre njenog imena stavite znak #.

Pogledajmo u praksi. Neka, na primer, imamo div. Zabeležimo ga u šablonsku promenljivu:

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

Sada će u promenljivoj userName biti referenca na DOM element našeg div-a. I možemo joj pristupiti na isti način kako se to radi u čistom JavaScript-u. Na primer, hajde da ispišemo tekst ovog div-a u drugom tagu:

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