Angular 5 Material Spinner is not working

I tried to fork the mat-spinner example given and that works perfectly. The only difference that I could see is the way you import the progress spinner module instead of importing it from a specific path do this:

  import { MatProgressSpinnerModule } from '@angular/material';

You don`t need to import anything inside your component as mat-spinner extends matprogressSpinner.

Inside the relevant html just do what you were doing i.e.


You can have a look at this: which might give you some more context.

[mode]=”determinate” << This will only show the circle but will not spin!


[mode]=”‘determinate'” // <<<< single quote for constant value


Also as mentiond by deanwilliammills,
mode = “determinate”

The key here for me was to import BrowserAnimationsModule. I’m using angular 10

inside your app.module.ts file
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

inside imports array put BrowserAnimationsModule .