JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.angularjs.org/1.2.0/angular.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css">
<div ng-app="app">
  <div class="progress-bar progress-bar-warning" progressbar></div>
</div>

JavaScript

var module = angular.module("app", []);

module.directive("progressbar", function() {
  return {
    restrict: "A",
    link: function(scope, element) {

      //debugger;
      element.css("height", 20);
      for (var i = 0; i < 100; i++) {
        //console.log(i);
        element.css("width", i / 100 + "%");
      }

    }
  };
});