0Pricing
Angular Academy · Lección

Qué son las señales

Comprenda las señales como contenedores de estado reactivo.

Qué son las señales es una lección gratuita de Angular Academy en CoddyKit. Esta es la lección 1 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Angular Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Angular Academy incluye 4 lecciones en total.

¿Qué son las señales?

Una señal es una primitiva reactiva introducida en Angular moderno. Es un envoltorio alrededor de un valor que puede notificar a los consumidores interesados cuando ese valor cambia.

Las señales hacen que la reactividad de Angular sea explícita, granular y fácil de comprender.

Por qué es importante la reactividad

En un framework de interfaz de usuario, la pantalla debe mantenerse sincronizada con sus datos. Cuando los datos cambian, la vista debe actualizarse.

Las señales ofrecen a Angular una forma precisa de saber exactamente qué ha cambiado y qué depende de ello, de modo que solo se actualicen las partes afectadas de la vista.

El problema antes de las señales

Anteriormente, Angular dependía de Zone.js y de una detección de cambios generalizada: después de cualquier evento asíncrono, Angular volvía a comprobar grandes partes del árbol de componentes.

Funciona, pero puede resultar ineficiente. Las señales permiten realizar actualizaciones detalladas sin analizarlo todo.

Una señal contiene un valor

Imagine una señal como una caja inteligente alrededor de un valor. Puede leer lo que contiene y reemplazar su contenido.

Al leer una señal también se registra quién la está leyendo, para que sus dependientes puedan actualizarse más adelante.

import { signal } from '@angular/core';

const count = signal(0);
// count is now a signal holding the number 0

Leer es llamar a una función

Una idea clave: para leer una señal, debe llamarla como una función. Los paréntesis indican a Angular que está leyendo el valor actual.

const count = signal(0);
console.log(count()); // 0  <-- note the ()

Las señales son síncronas

Leer una señal es una operación síncrona y siempre devuelve inmediatamente el valor actual. No hay ninguna suscripción, async pipe ni cancelación manual de suscripciones que gestionar.

Writable frente a Computed

La señal básica creada con signal() es writable: puede cambiar su valor.

También existen señales computed (valores derivados) y effects (efectos secundarios), que se construyen sobre las señales writable.

Las señales rastrean las dependencias

Cuando un valor computed o una plantilla lee una señal, Angular registra automáticamente esa dependencia.

Más adelante, si la señal cambia, solo se recalculan esos dependientes. Esto es lo que hace eficientes a las señales.

Actualizaciones sin inconsistencias

Las señales están diseñadas para no producir glitches: los consumidores siempre ven un valor coherente y no reciben notificaciones con un estado intermedio o actualizado a medias.

Esto hace que los grafos reactivos complejos sean predecibles.

Dónde se encuentran las señales

Las señales forman parte de @angular/core. Importe signal, computed y effect desde allí.

Puede utilizarlas dentro de componentes, servicios o cualquier código TypeScript.

import { signal, computed, effect } from '@angular/core';

Señales en un componente

Un patrón habitual consiste en declarar señales como campos de clase en un componente y después leerlas en la plantilla.

import { Component, signal } from '@angular/core';

@Component({ selector: 'app-counter', template: '' })
export class CounterComponent {
  count = signal(0);
}

Comprobación rápida: conceptos básicos de las señales

Compruebe si ha entendido qué es una señal.

Repaso: qué son las señales

Ha aprendido que una señal es un envoltorio reactivo alrededor de un valor que notifica a los consumidores cuando cambia. Para leer una señal debe llamarla mediante paréntesis; las lecturas son síncronas y las señales permiten actualizaciones detalladas y sin inconsistencias.

A continuación, creará y leerá sus propias señales.

Preguntas frecuentes

¿La lección «Qué son las señales» es gratis?

Sí — el texto completo de «Qué son las señales» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Angular Academy, actualiza a CoddyKit PRO. El curso de Angular Academy incluye 4 lecciones en total.

¿Qué aprenderé en «Qué son las señales»?

Comprenda las señales como contenedores de estado reactivo. Practicas Angular Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar Angular Academy?

No se requiere experiencia previa. Angular Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 1 de 4.

¿Cuánto tiempo toma la lección «Qué son las señales»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de Angular Academy?

Sí. Cada lección de Angular Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

  1. Qué son las señales
  2. Creación y lectura de señales
  3. Actualización de señales con set y update
  4. Señales en plantillas
← Volver a Angular Academy