Edit in JSFiddle

<div class="container" data-ng-app="">
    <div ng-init="fruitList=['apple','banana','tomato','lemon','grape']">
        <ul>
            <li ng-repeat="fruit in fruitList" ng-class="'{{fruit}}'">{{fruit}}</li>
        </ul>
        <ul>
            <li ng-repeat="fruit in fruitList" ng-class="{'even':{{$index%2==0}}}">{{fruit}}</li>
        </ul>
        <div ng-controller="mainCtrl">
            <div>
                <div class="box" ng-style="bgStyle">{{bgStyle.backgroundColor}}</div>
                <button class="btn btn-default" ng-click="changeColor('yellow')">Color Change</button>
            </div>
        </div>
    </div>
</div>

var mainCtrl = function($scope){
    $scope.bgStyle = {
        backgroundColor: 'red'
    };
    $scope.changeColor = function(color){
        $scope.bgStyle.backgroundColor = color;
    };
};

.apple { background-color: red; }
.lemon { background-color: yellow; }
.even { background-color: blue; color: #fff; }

.box { display: block; height: 50px; border: 1px solid #ccc; }