How to add JQuery plugin after compile function inside directive

[itsme....@gmail.com]

Hi,

I am building currently tree structure using directives and i had made two directive one for parent and one tree node so right now i am succeed to create tree structure. But whenever i am trying to applying any plugin like JsTree (JQuery) then it does not apply the plugin on to it.

following is my directive code.

angular.directive('treeNode', function ($compile) {

        return {

            restrict: 'E',

            replace: true,

            link: function (scope, element, attrs) {

                scope.tree = scope.item;

                console.log(scope.node);

                scope.$watch(scope.node, function () {

                    var template = angular.element('<ul class="subsections" style="display:{{tree.visible}}">' +

                        '<li ng-repeat="item in tree.childs" style="display:{{item.visible}}"><a href="{{item.link}}">{{item.text}}</a><tree-node tree="item"></tree-node></li></ul>');

                    $compile(template)(scope);

                    element.replaceWith(template);

                });

            }

        };

    })

    .directive('tree', function ($compile) {

        return {

            restrict: 'E',

            replace: true,

            

            link: function (scope, element, attrs) {

                // check attributes changes

                scope.$watch(attrs.treeSource, function () {

                    var template = angular.element('<ul class="qtree" >' +

                        '<li class="nt_open" ng-repeat="item in ' + attrs.treeSource + '" style="display:{{item.visible}}"><a href="{{item.link}}">{{item.text}}</a><tree-node tree="item"></tree-node></li></ul>');

                    $compile(template)(scope);

                    element.replaceWith(template);

                });

            }

        };

    });

Structure is building from the directive but i am not able to applying plugin on to this.

[m48u]

Hi,

I didn't really get want your problem is but I think I had similar problems by wrinting a custom directive für jQuery Sparklines; maybe you find a hint in there

http://jsfiddle.net/XznXY/4/

Cheers

[Ashu Mittal]

Actually i am planning to build tree for my application so for that i am using jsTree plugin so i want to integrate that plugin into my directive.

Actually what i am doing is i am building the Html Bulleted List structure with angular JS  directive using recursion. But after compiling it i want to call the JQuery Tree Plugin But it is not applying.