クリックしたときに子要素にclassを追加

• {{item}}

<ul>
  <li class="child" ng-repeat="item in items" add-red>
    <span class="item">{{item}}</span>
  </li>
</ul>

var app = angular.module('app', []);
app.controller('Ctrl', function($scope) {
  $scope.items = [
    'child1',
    'child2',
    'child3'
  ];
});
app.directive('addRed', function() {
  return {
    link: function(scope, elem) {
      elem.on('click', function() {
        var item = angular.element(elem[0].querySelector('.item'));
        // elem.find('.item').addClass('red')ではない
        item.addClass('red');
      });
    }
  };
});