how do I change the color of animated progress bar in my angular application

Asked Oct 25 '21 at 06:30

Active Oct 25 '21 at 12:44

Viewed 203 times

ts:

progress :any = 0;

ngOnInit() { setInterval(() => { this.progress += 1; }, 100)

html:

<mat-progress-bar style="height: 10px" mode="determinate" [value]="progress">
</mat-progress-bar>

this is an animated progress bar and I want to figure out how can I change the color of it after certain period like when the progress bar reaches 70% the color should change to yellow and when it reaches 90% the color should change to red

edited Oct 25 '21 at 12:44

kian

1,449
2
13
21

asked Oct 25 '21 at 06:30

Tejan Brahma

Is [this](https://stackoverflow.com/questions/52330515/change-angular-material-progress-bar-color-from-code) you are looking for? – navnath Oct 25 '21 at 06:46
no bro im looking for change in animated one they are just still progress bars – Tejan Brahma Oct 25 '21 at 07:06
and i even want the change to happen in the same progress bar not in different bar – Tejan Brahma Oct 25 '21 at 07:09

how do I change the color of animated progress bar in my angular application

0 Answers0