What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more
APP_INITIALIZER is a dependency-injection token that lets you run functions during Angular application startup and hold initialization until they finish. Angular marks the token deprecated since v19.0 and recommends provideAppInitializer() instead. If you are writing new startup code, use the function form; if you maintain an NgModule application, the token still works and is documented as a legacy pattern.
What APP_INITIALIZER does
Angular’s API reference for the token says that “the provided functions are injected at application startup and executed during app initialization.” Angular’s APP_INITIALIZER API reference describes it as a multi-provider: you register one or more initializer functions, and Angular runs each of them before the application finishes starting. The typical use is loading something the first screen depends on, such as a runtime configuration file, a feature flag set, or a user session check.
The token is a multi-provider, so several initializers can be registered in the same injector. Angular runs them during startup; the order in which they are registered is the order you should reason about when one initializer depends on another’s side effects.
Recommended Free Tools
Replacing APP_INITIALIZER with provideAppInitializer
The current replacement is provideAppInitializer(initializerFn), documented in the provideAppInitializer API reference. It returns EnvironmentProviders, so it is used directly in the providers array of bootstrapApplication() or in a route or environment provider list.
#1 Best Overall
To migrate a standalone application:
- Find every
{ provide: APP_INITIALIZER, ... }entry in your providers, including those inside feature or library provider arrays. - Move the factory body into a plain function. Replace the
useFactorywiring and thedepslist with calls toinject()inside the function body. - Replace the entry with
provideAppInitializer(() => { ... })and removemulti: true, which has no meaning for the new function form. - Confirm that the function returns the Promise or Observable that represents the startup work, or returns nothing if the work is synchronous.
- Run the application and check that the first view renders only after the startup work has completed.
Migration to standalone bootstrapping is not required for this step. An NgModule application can adopt provideAppInitializer in its own providers, but if it still uses the old token, the token remains documented and does not need to be removed to keep the app working.
How Angular waits for async startup work
An initializer can return a Promise or an Observable. Angular uses the return value to decide when startup is complete:
- Promise: Angular waits until the Promise resolves. A rejected Promise stops the startup path that depends on it, so handle errors you expect (for example, a missing configuration file) inside the initializer if the app should still start.
- Observable: Angular waits until the Observable completes. An Observable that emits values but never completes keeps initialization pending. This follows from the completion rule in Angular’s documentation rather than a separate warning, so design the stream to complete, for example with
take(1),first(), orfirstValueFrom(). - Nothing returned: Angular does not wait on the function, so use this form only for synchronous setup.
Injection context and dependencies
Initializer functions run in an injection context. The provideAppInitializer reference notes: “Note that the provided initializer is run in the injection context.” That means you can call inject() directly inside the function, which is how the official example reads its HTTP client. Do not store the injected value in a variable outside the function and reuse it later, and do not call inject() from a callback that runs after startup finishes, because that call will fail outside an injection context.
Example: loading configuration before the app starts
Angular’s documented standalone pattern fetches a configuration file, waits for it, and then lets the app bootstrap. The example below follows that shape:
Rank #3
import { bootstrapApplication } from '@angular/platform-browser';
import { provideHttpClient, HttpClient } from '@angular/common/http';
import { provideAppInitializer, inject } from '@angular/core';
import { firstValueFrom } from 'rxjs';
bootstrapApplication(App, {
providers: [
provideAppInitializer(() => {
const http = inject(HttpClient);
return firstValueFrom(http.get('/api/config'));
}),
provideHttpClient(),
],
});firstValueFrom() subscribes, takes the first emitted value, and completes, so Angular receives the completion it needs. The provideHttpClient() entry is included so that HttpClient can be injected; without it the initializer will fail when it calls inject(HttpClient).
If the configuration must be stored somewhere the rest of the app can read it, write it to a service in the same function before returning. Services injected later in the application will then see the loaded values.
Legacy NgModule form
In an NgModule application, the older pattern registers the token as a multi-provider with a factory:
providers: [
{
provide: APP_INITIALIZER,
useFactory: (config: ConfigService) => () => config.load(),
deps: [ConfigService],
multi: true,
},
]This is the form that the deprecation note covers. Its behavior matches the function form: Angular runs the returned function at startup and waits for a returned Promise or Observable. The difference is the wiring, which uses deps instead of inject().
Choosing between the initializer APIs
Angular has three related initializer families. They differ by lifecycle scope, by the async contract their functions can use, and by the provider form they return. Pick by when the code needs to run, not by name similarity.
| API | Runs when | Async contract | Provider form | Status |
|---|---|---|---|---|
APP_INITIALIZER (token) |
Application startup | Function may return a Promise or Observable; Angular waits for it | Multi-provider token | Deprecated since v19.0; legacy pattern |
provideAppInitializer() |
Application startup | Function may return a Promise or Observable; Angular waits for it | EnvironmentProviders |
Recommended replacement for APP_INITIALIZER |
providePlatformInitializer() |
When the platform injector is initialized | Signature shown as () => void |
StaticProvider |
Replacement for the deprecated platform initializer token |
provideEnvironmentInitializer() |
When an environment injector is constructed | Signature shown as () => void |
EnvironmentProviders |
Replacement for the deprecated environment initializer token |
The table is based on the signatures shown in Angular’s providePlatformInitializer and provideEnvironmentInitializer references. If you need a function to block startup until an HTTP call completes, the application-level function is the only one of these with a documented Promise or Observable contract.
Deprecation status and removal timing
The APP_INITIALIZER API page labels the token deprecated since v19.0 and points to provideAppInitializer. The page does not name a removal release. Angular’s versioning and releases policy says deprecated APIs remain available through at least the next major version and then become candidates for removal. Treat that as the general rule, and check the release notes for the Angular version you are upgrading to before assuming removal timing for this token. As of the Angular API reference checked in October 2026, there is no published removal date for APP_INITIALIZER.
Quick Recap
Migration checklist
- Search the codebase, including libraries, for
APP_INITIALIZER,ENVIRONMENT_INITIALIZER, andPLATFORM_INITIALIZER. - Replace application-startup entries with
provideAppInitializer(). - Confirm that each returned Promise resolves and each Observable completes under both successful and failed responses.
- Do not move platform or environment setup into the application initializer just because the names look similar; use the matching provider function for that scope.
“””
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
