angu-tree-view/example/js/angu-tree-view.min.js

A tree view for AngularJS

angular.module("anguTreeView",[]).directive("anguTreeView",function($http,$q,$compile,$timeout,$filter){return{scope:{RtnMenus:"=ngModel",treeNodes:"=",isEnableChecked:"@",plusCss:"@",minusCss:"@",isInit:"@"},template:'<script type="text/ng-template" id="nodes.html"><input type="checkbox" ng-checked="menus[node.Id].IsSelected" ng-show="isEnableChecked" ng-click="SetChecked(node)"><button type="button" ng-show="menus[node.Id].IsShowExt" ng-click="ShowSubnodes(node)"><i ng-class="plusCss"></i></button><button type="button" ng-show="menus[node.Id].IsShowColp" ng-click="HideSubnodes(node)"><i ng-class="minusCss"></i></button><input type="button"  class="btn btn-link" value="{{node.Title}}"  ng-click="SetChecked(node)" /><div class="list-group-item treeView" ng-show="menus[node.Id].IsShow"  ng-repeat="node in node.Nodes" ng-include="\'nodes.html\'" ></div><\/script><div class="list-group borderless"><div class="list-group-item treeView" ng-repeat="node in treeNodes" ng-include="\'nodes.html\'"></div></div>',link:function($scope,$element,$attrs){function initMenus(nodes){angular.forEach(nodes,function(node){var isFirstLvl=!1;null==node.ParentId&&(isFirstLvl=!0);var hasSubnodes=!1;null!=node.Nodes&&node.Nodes.length>0&&(hasSubnodes=!0),$scope.menus[node.Id]={Id:node.Id,IsFirstLvl:isFirstLvl,HasSubnodes:hasSubnodes,IsSelected:node.IsSelected},null!=node.Nodes&&initMenus(node.Nodes)})}function show1stSubNodes(nodes,index){angular.forEach(nodes,function(node){$scope.menus[node.Id].IsShow=1==index,node.Nodes.length>0&&show1stSubNodes(node.Nodes,index+1)})}$scope.menus=[],$scope.plusCss||($scope.plusCss="plus"),$scope.minusCss||($scope.minusCss="minus"),"true"==$scope.isEnableChecked?$scope.isEnableChecked=!0:$scope.isEnableChecked=null,initMenus($scope.treeNodes),angular.forEach($scope.menus,function(menu){menu.HasSubnodes?(menu.IsShowExt=!0,menu.IsShowEColp=!1,menu.IsShow=!1):menu.IsFirstLvl?(menu.IsShowExt=!1,menu.IsShowEColp=!1,menu.IsShow=!0):(menu.IsShowExt=!1,menu.IsShowEColp=!1,menu.IsShow=!1)}),$scope.SetChecked=function(node){var isStop=!1;angular.forEach($scope.menus,function(item){isStop||item.Id==node.Id&&(item.IsSelected=!item.IsSelected,isStop=!0)}),"true"==$scope.isInit&&null!=$scope.isInit||angular.forEach($scope.RtnMenus,function(rtnItem){rtnItem.Id==node.Id?rtnItem.IsSelected=!rtnItem.IsSelected:rtnItem.IsSelected||(rtnItem.IsSelected=!1)})},$scope.ShowSubnodes=function(parent){var id=parent.Id;$scope.menus[id].IsShowExt=!1,$scope.menus[id].IsShowColp=!0,show1stSubNodes(parent.Nodes,1)},$scope.HideSubnodes=function(parent){var id=parent.Id;$scope.menus[id].IsShowExt=!0,$scope.menus[id].IsShowColp=!1,angular.forEach(parent.Nodes,function(subnode){$scope.menus[subnode.Id].IsShow=!1})},$scope.$watch($scope.menus,function(newValue,oldValue){1!=$scope.isInit&&"true"!=$scope.isInit||$scope.menus&&($scope.RtnMenus=[],angular.forEach($scope.menus,function(node){null!=node&&null!=node.Id&&$scope.RtnMenus.push(node)}))})},controller:function($scope,$element){}}});