<div> <script type="text/ng-template" id="tree_node_template"> <div ng-if="document.subDocuments && document.subDocuments.length > 0" class="expander-container"> <!--<img src="/Content/images/expand.png" class="tree-expander" ng-click="toggle(this)" ng-class="{hidden: collapsed}" /> <img src="/Content/images/collaspe.png" class="tree-expander" ng-click="toggle(this)" ng-class="{hidden: !collapsed}" />--> <i class="fa fa-plus tree-i" aria-hidden="true" ng-click="toggle(this)" ng-class="{hidden: !collapsed}"></i> <i class="fa fa-minus tree-i" aria-hidden="true" ng-click="toggle(this)" ng-class="{hidden: collapsed}"></i> </div> <div ui-tree-handle> <input ng-if="enableSelect == 'true'" type="checkbox" ng-model="document.isChecked" ng-click="selectDocument(document,$parent.$parent.$parent.$parent.document,'oncheckbox')"> <a ng-bind-template="{{document.name}}" ng-click="selectDocument(document,$parent.$parent.$parent.document,'ondocumentname')"></a> </div> <ul ui-tree-nodes="" ng-model="document" ng-class="{hidden: collapsed}"> <li ng-repeat="document in document.subDocuments" collapsed="{{isCollapse}}" ui-tree-node ng-include="'tree_node_template'"> </li> </ul> </script> <div ui-tree data-drag-enabled="false" class="tree-view"> <ul ui-tree-nodes="" ng-model="documentHierarchy"> <li ng-repeat="document in documentHierarchy" ui-tree-node ng-include="'tree_node_template'"> </li> </ul> </div> </div>