Angular 51: APIs standalone y bootstrapApplication
easy⏱ 5 mincourseangular
ApplicationConfig reemplaza el arreglo de providers de AppModule
Donde un @NgModule solía listar imports: [HttpClientModule, RouterModule.forRoot(routes)], un ApplicationConfig lista en su lugar providers basados en funciones: provideRouter(routes), provideHttpClient(), provideAnimations(), etc. Cada función provideX() devuelve el conjunto de providers que esa funcionalidad necesita — armas una app combinándolos en un arreglo plano.
export const appConfig: ApplicationConfig = {
providers: [provideRouter(routes), provideHttpClient()],
};
bootstrapApplication arranca toda la app desde un componente
bootstrapApplication(AppComponent, appConfig) es todo el main.ts. Renderiza AppComponent directamente en <body> (mediante su selector en index.html) con los providers de appConfig disponibles en toda la app, sin necesidad de un módulo contenedor.
bootstrapApplication(AppComponent, appConfig).catch((err) => console.error(err));
Los componentes standalone importan lo que usan, directamente
AppComponent necesita RouterOutlet para renderizar <router-outlet />, así que lo declara en imports: [RouterOutlet] directamente en el decorador @Component, el mismo patrón que importar FormsModule o CommonModule en cualquier otro componente standalone.