AngularProgressbar is a custom progress bar that can be controlled as an angular directive.

angular progress bar with percentage, angular progress bar npm, angular material progress bar example, angular progress bar color

Vue Plugin For Linear Progress Bar | k-progress

How to make use of it:

1. Include the progressBar module in index.html.

<script src="modules/progressBar.js" type="text/javascript"></script>

2. Include the unit below in your application.

var myapp = angular.module('MyApp',['ui.progressbar']);

3. To implement the logic in HTML.

<div ng-controller="TestBenchController">
    <progress-bar percentage-value="value"></progress-bar>
</div>

4. Launch the progress bar from the console.

myapp.controller('TestBenchController',['$scope',function ($scope) {

    $scope.value = 85; // percentage that should be shown in the progressbar as completed min:0, max:100
    
}]);

5. Additional optional attributes with which you can control color and size:

default-size = [big,medium,small]
default-color = [green,orange]

Custom Circular Progress Bar, AngularProgressbar Plugin/Github

See Demo And Download

Official Website(pavanjava): Click Here

This superior jQuery/javascript plugin is developed by pavanjava. For extra advanced usage, please go to the official website.