Carlos Cifuentes
Referencia AngularJS → Angular

$rootScope.$broadcast / $on en Angular moderno

Los eventos globales de $rootScope pasan a ser un servicio compartido que guarda el estado. Los componentes lo leen; ya no escuchan nombres de eventos.

Antes · AngularJS
// somewhere
$rootScope.$broadcast('cart:updated', cart);

// somewhere else
$scope.$on('cart:updated', function (event, cart) {
  vm.count = cart.items.length;
});
Después · Angular
@Injectable({ providedIn: 'root' })
export class CartStore {
  readonly cart = signal<Cart>({ items: [] });
  readonly count = computed(() => this.cart().items.length);
}

// any component
count = inject(CartStore).count;

Qué cambia

  • El estado tiene un dueño y un tipo, en vez de viajar como un payload sin tipo.
  • Los componentes se actualizan solos cuando cambia el signal; no hay listeners que limpiar.
  • Para eventos puntuales de verdad (no estado), expón un Subject desde el servicio.

Consejo de migración. Reemplaza el bus de eventos antes de migrar las pantallas que lo usan. Un servicio tipado se puede compartir entre ambos frameworks; los eventos por string no se pueden rastrear.

Relacionado

¿Planeas una migración o una plataforma de microfrontends?

En una llamada de 20 minutos me cuentas tu situación y te digo cómo la abordaría. Si todavía no vale la pena, también te lo digo.

Escríbeme por LinkedIn