A Pen by CarterTsai.

angularjs-ng-repeat-and-ng-class.markdown

angularjs ng-repeat and ng-class

A Pen by CarterTsai on CodePen.

License.

index.html

<div ng-app="" ng-controller="MainCtrl as main"> 
  <ul>
    <li ng-repeat="item in items">
      <a href="#" ng-class="{myColor: main.colorful ==  $index}" 
         ng-click = "main.colorful = $index" 
         ng-bind = "item.name">
      </a>
    </li>  
  </ul>
</div>

script.js

function MainCtrl($scope) {
  $scope.items = [
    {id:"0", name: "Javascript" },
    {id:"1", name: "C/C++" },
    {id:"2", name: "AngularJS" },
  ]
  $scope.colorful = 0;
}

style.css

.myColor {
  background-color : #ccc;  
}