角js在ng点击动态树节点

Question

我有JSON格式的数据。数据包含3个字段：基于其父为空

1. _id
2. FOLDER_NAME
3. 父

在页面加载，我已经显示根节点。点击即可获取当前节点的子节点。我想在点击时展开这些节点。我能够达到这个水平达到第一级，之后它不能正常工作。

here is my whole code: 

https://jsfiddle.net/chirag273/39ossopj/

我不想在一开始分配的所有数据。单击时，我只需要父级的子节点数据。

在此先感谢

Answer 1

也许如果你写控制器这样就可以解决，并从NG-初始化指令调用函数。我举例link

<div ng-controller="AppCtrl" ng-app="myApp"> 
     <div ng-init="showManu()"></div> 
     <div id="menu"></div> 
</div> 
     var app = angular.module('myApp', []); 
app.controller('AppCtrl', ['$scope','$http','$compile',function ($scope, $http, $compile) { 
    $scope.roots = [{ 
    Folder_Name:'root1', 
    _id:'1', 
    parent:null 
    },{ 
    Folder_Name:'root2', 
    _id:'2', 
    parent:null 
    },{ 
    Folder_Name:'newrow', 
    _id:'9', 
    parent:'1' 
    },{ 
    Folder_Name:'chirag', 
    _id:'3', 
    parent:'1' 
    },{ 
    Folder_Name:'sumit', 
    _id:'4', 
    parent:'2' 
    },{ 
    Folder_Name:'vikas', 
    _id:'5', 
    parent:'4' 
    } 
    ]; 


     $scope.showManu = function(){ 
        angular.forEach($scope.roots, function(root){ 
      if(root.parent == null){ 
         var myEl = angular.element(document.getElementById('menu')); 
     var html = '<ul><li id="'+root._id+'" ><a ng-click="hideShow('+root._id+')">'+root.Folder_Name+'</a></li></ul>'; 
     var element = $compile(html)($scope); 
     myEl.append(element); 
      } 
      }) 
      var hideList = []; 
      $scope.hideShow = function(id){ 
        if(hideList.indexOf(id)==-1){ 
          getLi(id); 
        hideList.push(id); 
       } 
       else{ 
       var classHide = document.getElementById(id); 
       var x = classHide.getElementsByTagName("ul") 
       console.log(x.length); 
       for(var i = x.length; i>=1; i--){ 
       console.log(i); 
         classHide.removeChild(classHide.childNodes[i]); 
        } 
          hideList.splice(hideList.indexOf(id),1); 


       } 
      } 

      function getLi(root){ 
      angular.forEach($scope.roots, function(r){ 
        if(r.parent == root){ 
         var myEl = angular.element(document.getElementById(r.parent)); 
     var html = '<ul class="'+r.parent+'"><li id="'+r._id+'"><a ng-click="hideShow('+r._id+')">'+r.Folder_Name+'</a></li></ul>'; 
     var element = $compile(html)($scope); 
     myEl.append(element); 
       } 
      }) 
      } 


      } 



}]);