Variables de plantilla en Angular
En Angular se puede acceder a las etiquetas
de la página mediante variables de plantilla.
Estas permiten vincular una etiqueta a una variable
y hacer referencia a ella durante el funcionamiento
del componente. Para declarar dicha
variable, hay que poner el símbolo #
antes de su nombre.
Veámoslo en la práctica. Supongamos, por ejemplo, que tenemos un div. Guardémoslo en una variable de plantilla:
<div #userName>
text
</div>
Ahora en la variable userName habrá
una referencia al elemento DOM de nuestro div.
Y podemos usarla tal como se hace en JavaScript puro.
Por ejemplo, mostremos el texto de este div
en otra etiqueta:
<div>
{{ userName.textContent }}
</div>
Se da un div. Se da una imagen. Guarde la referencia
a la imagen en una variable de plantilla. Muestre
src de nuestra imagen dentro del div.
