Angular Material Progress Spinner not animated

Viewed 1370

I am trying to add an indeterminate spinner from Angular Material. I checked the official stack blitz example https://stackblitz.com/angular/nkabnxaenep. I compared the package jsons and cant find any differences. a am ahead a few minor versions. The determinate mode works though... I imported the correct module and there are no errors at runtime.

<mat-spinner mode="indeterminate"></mat-spinner>

not working spinner image

Any ideas? Tell me if you need more information.

2 Answers

To enable the animations of Angular Material you have to import the BrowserAnimationsModule into your AppModule as mentioned in the 2nd step of the getting started guide.

imports: [
    BrowserModule,
    BrowserAnimationsModule,
    // NoopAnimationsModule,
    ...

Note: make sure to remove the NoopAnimationsModule from your project as well.

Like @Robin De Schepper suggested, the solution is to add BrowserAnimationsModule to app.module.ts

like this:

imports: [
    BrowserModule,
    BrowserAnimationsModule,
    // NoopAnimationsModule,
    ...

NOTE: For the newer versions of Angular, if you have NoopAnimationsModule in your imports array, you must comment/remove it.

Related