JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.angularjs.org/angular-1.0.0rc5.min.js"></script>
<html ng-app="TreeApp">
<body ng-controller="treeController" >    
    <tree items="{{items}}"></tree>
</body>
</html>

JavaScript

function treeController($scope) {
     $scope.items = ['a', 'b', ['c1', 'c2']];
 }
 
 
 angular.module('components', [])
     .directive('tree', function() {
         return {             
            restrict: 'E',             
            
             // Working - no recursion here:
             //template: '<div ng-repeat="item in items">{{item}}</div>'
             
             // Not working:
             template: '<div ng-repeat="item in items">{{item}}<tree items="{{item}}"></tree> </div>' 
         }
     })
     
 angular.module('TreeApp', ['components'])