Carlos Cifuentes
Referencia AngularJS → Angular

$scope en Angular moderno

$scope desaparece. El estado vive en la clase del componente, y los signals le dicen a Angular exactamente qué cambió.

Antes · AngularJS
app.controller('CartCtrl', function ($scope) {
  $scope.items = [];
  $scope.total = 0;
  $scope.add = function (item) {
    $scope.items.push(item);
    $scope.total += item.price;
  };
});
Después · Angular
@Component({ selector: 'app-cart', templateUrl: './cart.component.html' })
export class CartComponent {
  items = signal<Item[]>([]);
  total = computed(() => this.items().reduce((sum, i) => sum + i.price, 0));

  add(item: Item) {
    this.items.update(list => [...list, item]);
  }
}

Qué cambia

  • Las propiedades de $scope pasan a ser signals o campos de la clase.
  • Los valores derivados de otros pasan a ser computed, en vez de actualizarse a mano.
  • La herencia de scope entre controladores anidados se reemplaza por inputs, outputs y servicios compartidos.

Consejo de migración. Antes de migrar, pasa los controladores a la sintaxis controllerAs. El código que ya no toca $scope se convierte casi línea por línea.

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