Indeterminate progress bar not working properly

Question

I am using MatProgressBarModule to add a linear indeterminate status bar at end of card-footer. Below is my code -

  <mat-card-footer>
    <ng-content select="dashboard-card-footer"></ng-content>
    <section class="example-section">
    <mat-progress-bar  [mode]="indeterminate"  value="20" bufferValue ="75"> 
    </mat-progress-bar>
    </section>
  </mat-card-footer>

It shows on screen as determinate status bar. I have tried with different modes too i.e. query,buffer. But it only works as a determinate progress bar.

score 3 · Answer 1 · answered May 27 '22 at 12:21

3

Try to check, maybe you have imports: NoopAnimationsModule, cause it will disable all animations for your app)

answered May 27 '22 at 12:21

sachith walpita

51
2

Anshuman Jaiswal · Accepted Answer · 2018-08-22T10:58:22.150

2

You should not use [] (it should be used when you want to bind value with any object/variable) for defining mode, as indeterminate is not component variable but only string. Also no need of value & bufferValue. Modify your code as:

<mat-card-footer>
    <ng-content select="dashboard-card-footer"></ng-content>
    <section class="example-section">
    <mat-progress-bar mode="indeterminate"></mat-progress-bar>
    </section>
</mat-card-footer>

edited Aug 22 '18 at 10:58

answered Aug 22 '18 at 10:42

Anshuman Jaiswal

5,352
1
29
46

Hi, thanks for prompt reply. I started with the answered approach. Still it's not showing as indeterminate bar. I tried following example present here https://material.angular.io/components/progress-bar/examples – Narendra Pandey Aug 22 '18 at 11:03
It doesn't show animated movement as present in above mentioned site. – Narendra Pandey Aug 22 '18 at 11:04
can you create stackblitz? – Anshuman Jaiswal Aug 22 '18 at 11:15
3

it should work, I forked example and changed the mode. It's wokring https://stackblitz.com/edit/angular-astjm1. Make sure to import animation module. https://material.angular.io/guide/getting-started – Anshuman Jaiswal Aug 22 '18 at 11:18

Indeterminate progress bar not working properly

2 Answers2