Angular: CSS styling

http://angularjs.org/

by Jan Sathya

HTML

<div ng-controller="MyCtrl" ng-style="{color: myColor}">

    <input type="text" ng-model="myColor" placeholder="enter a color name">

    <div ng-repeat="item in items" ng-class="{'pending-delete': item.checked}">
      name: {{item.name}}, {{item.title}}
        <input type="checkbox" ng-model="item.checked"> <spen ng-show="item.checked">(will be deleted)</span>
            <img src="http://www.gettyimages.in/CMS/StaticContent/1391099215267_hero2.jpg" ng-style="{width: item.value+'%'}" >
   </div>
   <p>
       
   <div ng-hide="myColor== 'red'">I will hide if the color is set to 'red'.</div>
</div>

CSS

.pending-delete { background-color: pink }

JavaScript

var myApp = angular.module('myApp', []);

function MyCtrl($scope) {
    $scope.items = [
        {
        name: 'Misko',
        title: 'Angular creator',
            value: 30},
        {
        name: 'Igor',
        title: 'Meetup master'},
        {
        name: 'Vojta',
        title: 'All-around superhero'}

    ];
}