style to ng-style fix for IE
by jacobwsmith
HTML
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
<h1>Setting to Data Example</h1>
<div ng-controller="MyCtrl">
<div class="results">
<div
class="control-bar"
ng-style="{'width':item.votePercent + '%'};"
title="{{item.votes | number: 1}} of {{item.n | number: 1}} Votes"
>
</div>
<span class="bar-number">
{{item.votePercent | number: 1}}%
</span>
</div>
</div>
CSS
.control-bar {
background-color: green;
border: 1px solid #333;
border-right: 1px solid #333;
height: 12px;
margin: 0;
width: 100%;
float: left;
margin-right: 3px;
}
JavaScript
var app=angular.module('myApp', []);
function MyCtrl($scope) {
$scope.item = {
votePercent: 50,
votes: 3333,
n: 123
};
}