Sjabloonvariabelen in Angular
In Angular kun je toegang krijgen tot tags op de pagina met behulp van sjabloonvariabelen.
Ze maken het mogelijk om een tag aan een variabele te binden
en ernaar te verwijzen tijdens het werk
van de component. Om zo'n variabele te declareren,
moet je voor haar naam het teken # plaatsen.
Laten we het in de praktijk bekijken. Stel, we hebben bijvoorbeeld een div. Laten we deze in een sjabloonvariabele opslaan:
<div #userName>
text
</div>
Nu zal in de variabele userName
een verwijzing naar het DOM-element van onze div liggen.
En we kunnen er mee omgaan zoals dat
gedaan wordt in pure JavaScript.
Laten we bijvoorbeeld de tekst van deze div
in een andere tag weergeven:
<div>
{{ userName.textContent }}
</div>
Gegeven een div. Gegeven een afbeelding. Sla de verwijzing
naar de afbeelding op in een sjabloonvariabele. Geef
src van onze afbeelding weer binnen de div.