Angularjs directive : child nodes

Question

How to structure below directive so that I get access to all the ul elements in the link function.

In the below code, if I look at the elm (log to console), it is of type comment, the ul are siblings. How can I structure a directive so that, ul becomes child nodes to the elm in the link function (where directive is attached to). If that is not possible, how to get all siblings. So, I want to render the nested list (ul, li) but also need access to each ul in the link function.

thanks for the help.

[comment, ready: function, toString: function, eq: function, push: function, sort: function…]
0: comment
baseURI: "http://run.plnkr.co/PSOXzsCDf5Re0e4S/"
childNodes: NodeList[0]
data: " ngRepeat: d in data "
firstChild: null
lastChild: null
length: 21
localName: null
namespaceURI: null
nextElementSibling: ul.cont.ng-scope
nextSibling: ul.cont.ng-scope
ng-1379388042747: 6
nodeName: "#comment"
nodeType: 8
nodeValue: " ngRepeat: d in data "

code: http://plnkr.co/edit/oGwJNN?p=preview

'use strict';

var app = angular.module('Directives', []);

app.controller('MainCtrl', function ($scope) {
   $scope.data = [
            {
                cont: {id:1},
                children:[
                    {id:1}, {id:2}, {id:3}
                ]
            },
            {
                cont: {id:2},
                children:[
                    {id:1}, {id:2}, {id:3}
                ]
            }
        ];
});


app.directive('test', function ($timeout) {
  return {
      template: '<ul class="cont" ng-repeat="d in data">' +
                '<li class="ch" ng-repeat="node in d.children">' +
                '<span class="span2">' + 'id - {{node.id}}' + '</span>' +
                '</li>' +
                '</ul>',
            replace: true,
            restrict: 'E',
            scope: {
                data: '=',
                conf: '='
            }
            ,
            link: function (scope, elm, attrs) {
                console.log(elm)

            }
    };
});

Answer 1

I reworked your plunker the way I would do it, by putting the directive onto a element rather than its own element. That way your elements are seperate, and you can access each child of each

Revised Plunker