Nested directives in angularjs link: http://sporto.github.io/blog/2013/06/24/nested-recursive-directives-in-angular/

directives.js

app.directive('collection', function () {
  return {
    restrict: "E",
    replace: true,
    scope: {
      collection: '='
    },
    template: "<ul><member ng-repeat='member in collection' member='member'></member></ul>"
  }
});
app.directive('member', function ($compile) {
  return {
    restrict: "E",
    replace: true,
    scope: {
      member: '='
    },
    template: "<li></li>",
    link: function (scope, element, attrs) {
      if (angular.isArray(scope.member.children)) {
        element.append("<collection collection='member.children'></collection>");
        $compile(element.contents())(scope);
      }
    }
  }
});