Since the arrival of Standalones Component with Angular 15, NgModules
are now completely optional.
It is still necessary to declare providers to configure the root injector of the application.
With modules, it is possible to import other NgModules that define their own providers like HttpClientModule
, BrowserAnimationsModule
, RouterModule
, etc.
Without the modules, it is necessary to declare these providers when bootstrapping the application. Fortunately, there are functions provided by angular to facilitate the declaration of these providers. For example:
bootstrapApplication(AppComponent, {
providers: [
provideRouter(routes),
provideAnimations()
]})
Here is a non-exhaustive list of functions to set up regularly used providers :
Core
importProvidersFrom()
: Sets up providers collected from a given module
Animation
provideAnimations()
: Enable animation
provideNoopAnimations()
: Disable animation
HTTP
provideHttpClient()
: Sets up HttpClient service and configures it with some features
withInterceptors()
withInterceptorsFromDi()
withXsrfConfiguration()
withNoXsrfProtection()
withJsonpSupport()
withRequestsMadeViaParent()
provideHttpClientTesting()
: Sets up a mocked HttpClient service
Router
provideRouter()
: Sets up router functionality for the application
withInMemoryScrolling()
withEnabledBlockingInitialNavigation()
withDisabledInitialNavigation()
withDebugTracing()
withPreloading()
withRouterConfig()
provideLocationMocks()
: Sets up a mocked router for testing
NgRx
provideStore()
: Sets up the global store
provideState()
: Provides additional slices of state in the store
provideEffects()
: Sets up given effects
provideStoreDevtools()
: Sets up debug functionality
provideMockStore()
: Sets up a mocked store