Angular material animations not working after using custom theme

问题

I'm using angular material version 7 and angular version 7 After i change to custom theme It seems like all work accept the animations The mat-progress-bar stopped move like it should

this is my progress-bar

<mat-progress-bar mode="indeterminate"></mat-progress-bar>

and here is the custom theme

$my-primary: (
  50: #34495e,
  100: #34495e,
  200: #34495e,
  300: #34495e,
  400: #34495e,
  500: #34495e,
  600: #34495e,
  700: #34495e,
  800: #34495e,
  900: #34495e,
  A100: #34495e,
  A200: #34495e,
  A400: #34495e,
  A700: #34495e,
  contrast: (
    50: white,
    100: white,
    200: white,
    300: white,
    400: white,
    500: white,
    600: white,
    700: white,
    800: white,
    900: white,
    A100: white,
    A200: white,
    A400: white,
    A700: white
  )
);

$my-secondary: (
 // like above
);
// custom theme
@include mat-core();
$app-primary: mat-palette($my-primary);
$app-accent: mat-palette($my-secondary);
$app-warn: mat-palette($mat-red);
$app-theme: mat-light-theme($app-primary, $app-accent, $app-warn);
@include angular-material-theme($app-theme);

回答1:

Can you paste in the imports of your module? Ensure that BrowserAnimationsModule is imported.

Also check that NoopAnimationsModule is not imported.

回答2:

I solved it. i changed the primary color 50 100 200 300 400 to lighter color

来源：https://stackoverflow.com/questions/56683518/angular-material-animations-not-working-after-using-custom-theme