DI annotations ($inject, array syntax) en Angular moderno
Las anotaciones basadas en strings desaparecen. Angular identifica las dependencias por clase o InjectionToken, así que la minificación no puede romperlas.
Antes · AngularJS
// array syntax
app.controller('UserCtrl', ['$http', 'UserService',
function ($http, UserService) { /* ... */ }]);
// $inject property
function OrderService($http, API_URL) { /* ... */ }
OrderService.$inject = ['$http', 'API_URL'];
app.service('OrderService', OrderService);@Injectable({ providedIn: 'root' })
export class OrderService {
private http = inject(HttpClient);
private apiUrl = inject(API_URL);
}
@Component({ selector: 'app-user', templateUrl: './user.component.html' })
export class UserComponent {
private users = inject(UserService);
private analytics = inject(AnalyticsService, { optional: true });
}Qué cambia
- La sintaxis de arreglo, la propiedad $inject y ng-annotate ya no hacen falta.
- inject() pide una dependencia en un inicializador de campo, un constructor o una función factory, y TypeScript revisa su tipo.
- Las dependencias opcionales usan inject(Token, { optional: true }) en vez de chequeos manuales con $injector.has().
Consejo de migración. Activa ng-strict-di en la app legacy antes de empezar la migración. Saca a la luz anotaciones faltantes que solo fallan en builds minificados, y el build híbrido va a minificar ese código.
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