How to add BrowserAnimationsModule or NoopAnimationsModule to Standalone Component?

by

The importProvidersFrom function provides a bridge back to the NgModule world. It should not be used in component provide as it is only usable in an application injector

Add importProvidersFrom function to provide BrowserAnimationModule inside main.ts.

main.ts

bootstrapApplication(AppComponent,{
  providers:[importProvidersFrom([BrowserAnimationsModule])]
});

Forked Example

Update Angular 14+

Angular new versions provide two new function provideAnimations() and provideNoopAnimations() to enable and disable animation. we could use it like this.

    import { provideAnimations } from '@angular/platform-browser/animations';

    bootstrapApplication(AppComponent, {
        providers: [
          provideAnimations()
        ]
     })

Documentation Link

Leave a Comment