如何将材质“mat-progress-bar”的动画更改为从 0 而不是 100 开始？答案

【问题标题】：How to change animation of material "mat-progress-bar " to start from 0 instead of 100?如何将材质“mat-progress-bar”的动画更改为从 0 而不是 100 开始？
【发布时间】：2021-09-16 13:54:42
【问题描述】：

我正在使用角度材料中的进度条：

<mat-progress-bar  mode="determinate" value="40"></mat-progress-bar>

当我刷新页面时，我注意到进度条从 100 开始，然后将值减小到 40。有没有办法改变这种行为，使进度条从 0 开始并增加到 40？

【问题讨论】：

这里没有足够的信息来理解问题。此行不向我们提供信息。
如果你把这行放在angular组件的html中，会渲染进度条。然后，如果你刷新页面，你会注意到进度条从 100 开始，填充动画减少到 40。

标签： angular angular-material material-ui progress-bar

【解决方案1】：

看来你的问题和这个mat-progress-bar bug.有关甚至一位强硬的用户提到他无法再在 Angular 13 中重现它，但问题似乎仍然存在。

一种解决方法是禁用转换：

.mat-progress-bar .mat-progress-bar-fill {
    transition: none !important;
}

【讨论】：