JSFiddle - React, Tailwind, and code Playground

by opherv

HTML

<div ng:app="myApp">   
    Works:
    <div ng:controller="ctrl" class="container">
        <div class="item" ng-repeat="item in items" after-repeat>item {{$index}}</div>
    </div>
    
    Does not work:
    <div ng:controller="ctrl" class="container">
        <div class="item{{$index}}" ng-repeat="item in items" after-repeat>item {{$index}}</div>
    </div>
    
</div>

CSS

.container{

    border: 1px solid black;
    padding: 3px;
    margin: 5px;    
    
    }

.special{
    background-color: lime;
}

JavaScript

angular.module('myApp', []).directive('afterRepeat', function() {
    return  {        
        link: function(scope,element, attrs){                                
              if (scope.$index%2==0){
                    element.addClass("special");
                }
            }
    }
});

function ctrl($scope) {    
    $scope.items = ["apple","orange","banana"];
}