Angular: how to add a progress bar to show during a file upload

Angular: how to add a progress bar to show during a file upload

The vanilla  XMLHttpRequest() method implements the”progress” event  and it is pretty easy to use.
In angularJS (angular 1) we had to wait till the 1.5.something to have this method supported.
In angular (angular 2 which I am talking about) there is no support yet.

The easiest way to get this feature, is to use this good lib:
https://github.com/DarkXaHTeP/angular-progress-http

You can find all the instructions in the github page, the lib is updated and tested with the latest angular version.

Once you’ve got the progress percentage in your controller, you can easily implement a graphical progress bar with few lines of html and css,
An useful guide for ionic2, but it is a good input for any other implementation.
https://www.joshmorony.com/build-a-simple-progress-bar-component-in-ionic-2/

Leave a Reply

Your email address will not be published. Required fields are marked *