Angular 22
Ejercicios de Angular sobre Plantillas
5 ejercicios de Plantillas en Angular. Piensa la respuesta antes de abrirla: la explicación dice por qué las demás opciones fallan.
1 · Elige la respuesta · nivel 1
Si price() vale 5, ¿qué muestra la plantilla?
<p>Total: {{ price() * 2 }}</p>- ATotal: 10
- BTotal: {{ price() * 2 }}
- CTotal: 5 * 2
- DNada: no se puede operar en la plantilla
Ver la respuesta
Respuesta: A. Total: 10
La interpolación {{ }} evalúa una expresión y muestra su resultado como texto. Admite operaciones sencillas, aunque la lógica compleja conviene sacarla a un computed.
2 · Elige la respuesta · nivel 1
Si name vale "Carla", ¿qué muestra la plantilla?
<h1>Hola, {{ name }}</h1>- AHola, Carla
- BHola, {{ name }}
- CHola, name
- DHola,
Ver la respuesta
Respuesta: A. Hola, Carla
La doble llave {{ }} es la interpolación: muestra el valor de la expresión dentro del texto.
3 · Elige la respuesta · nivel 1
¿Qué muestra la plantilla?
<p>Resultado: {{ 3 + 4 }}</p>- AResultado: 7
- BResultado: 3 + 4
- CResultado: 34
- DResultado: {{ 3 + 4 }}
Ver la respuesta
Respuesta: A. Resultado: 7
Dentro de {{ }} va una expresión, y Angular muestra su resultado.
4 · Completa el hueco · nivel 1
Completa para mostrar el valor de username en el párrafo.
<p>Usuario: ___ username ___</p>- {{
- }}
- {
- }
Ver la respuesta
Respuesta: {{ · }}
<p>Usuario: {{ username }}</p>La interpolación de Angular usa doble llave: {{ username }}. Una sola llave no es interpolación.
5 · Elige la respuesta · nivel 2
¿Qué hace @let en esta plantilla?
@let total = price() * qty();<p>{{ total }} €</p>@if (total > 100) { <p>Envío gratis</p>}- ADeclara una variable local de solo lectura en la plantilla
- BCrea un signal editable
- CAñade una propiedad nueva a la clase del componente
- DNada: @let no existe en Angular
Ver la respuesta
Respuesta: A. Declara una variable local de solo lectura en la plantilla
@let guarda el resultado de una expresión para reutilizarlo en la plantilla sin repetir el cálculo. Se actualiza solo cuando cambian sus signals, pero no se puede reasignar.