I using bootstrap to show the progress bar. To change the value in the progress bar I am using Angular 2 Attribute Binding.
<div class="progress">
<div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" [attr.aria-valuenow]="progress" aria-valuemin="0" aria-valuemax ="100"
style="min-width: 2em;" [style.width]="(progress/100)*100 + '%'">
{{progress}}%
</div>
variable progress will be increasing when I upload a file and I am able to see the values in console log.
this.service.progress.subscribe(
data => {
console.log('progress = '+data);
this.progress = data;
console.log(this.progress) ;
});
Problem: The progress bar is showing 0 and then 100 once the upload is complete it is not progressing or showing in between values.please suggest.
There is no problem in the code. As the uploaded file size is very low it is quickly uploading. When i upload a bigger file it is working as expected.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With