Angular Tree view with checkbox

<!DOCTYPE html>
<html ng-app="plunker">
<head>
  <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular.js"></script>
  <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
  <link rel="stylesheet" href="//rawgit.com/iVantage/angular-ivh-treeview/master/dist/ivh-treeview.css">
  <link rel="stylesheet" href="//rawgit.com/iVantage/angular-ivh-treeview/master/dist/ivh-treeview-theme-basic.css">
  <meta charset="utf-8">
  <title>Angular JS</title>
</head>
<body >
  
  <div class="container">
    <div ng-controller="DemoCtrl as demo">
      
      
      
      <div ivh-treeview="demo.treeData"
           
             ivh-treeview-expand-to-depth="-1"></div>
      <div class="row">
        <div class="col-md-6">
          <h4>All Selected Things</h4>
          <ul>
            <li ng-repeat="item in demo.allSelected">
              <span ng-repeat="parent in item.parents | reverse" style=" color:#aaa">
            {{parent.label}}&rarr;
            </span>
            {{item.node.label}} ({{item.node.value}})
            </li>
          </ul>
          <p ng-hide="demo.allSelected.length"><em>Nothing selected yet</em></p>
        </div>
        <div class="col-md-6">
          <h4>Top Selected Things</h4>
          <ul>
            <li ng-repeat="item in demo.topSelected">
            <span ng-repeat="parent in item.parents | reverse" style=" color:#aaa">
            {{parent.label}}&rarr;
            </span>
            {{item.node.label}}
            </li>
          </ul>
          <p ng-hide="demo.topSelected.length"><em>Nothing selected yet</em></p>
        </div>
      </div>
    </div>
  </div>
  
      
  
  <script src="//rawgit.com/iVantage/angular-ivh-treeview/master/dist/ivh-treeview.min.js"></script>
  <script src="script.js"></script>

</body>
</html>

console.clear();

var app = angular.module('plunker', ['ivh.treeview']);
app.config(function(ivhTreeviewOptionsProvider) {
 ivhTreeviewOptionsProvider.set({
   defaultSelectedState: false,
   validate: true
 });
});
app.filter('reverse', function () {
    return function (items) {
        return items.slice().reverse();
    };
});

app.controller('DemoCtrl', function($scope, ivhTreeviewBfs, ivhTreeviewMgr) {
  var self = this;

    var treeData = self.treeData = [{
label: 'Lender',value:'1',
     
				children: [
{ label: 'Create',value:'2',selected:false,	children: []},
 
				         { label: 'Edit',value:'3' , selected:true,	children: []},
          
					{ label: 'View' ,value:'4',selected:true,	children: []},
         
					 { label: 'List View' ,value:'5'},
        
					  { label: 'Delete',value:'6' }
 ]
},
				 {
label: 'User Management', value:'7', 

				children: [
            { label: 'Create',value:'8'},
 
				    { label: 'Edit',value:'9' },
          
					{ label: 'View' ,value:'10'},
         
					 { label: 'List View' ,value:'11'},
        
					  { label: 'Delete',value:'12',  children:[
					    
					    { label: 'Delete All' ,value:'13'},
					    { label: 'Delete One' ,value:'14'}
					    
					    ]     
					 
}
          
				        
				 ]
					  }];

//IF YOU NEED TO LOAD DATAS INTO TREE FROM JSON FILE THIS IS WORKING PERFECT (I'm sorting my json by IdService from other input field)
  
//$scope.update = function () {
//    $http.post('/Home/TreeSection', data = { IdService: $scope.new.Reservation.IdService }).success(function (data) {
//        self.treeData = data;
//         treeData = data;
//     });
//  };

    var topSelected = self.topSelected = [];
    var allSelected = self.allSelected = [];

    self.gatherAllSelected = function () {
        ivhTreeviewBfs(treeData, function (node, parents) {
            if (node.selected) {
                allSelected.push({
                    node: node,
                    parents: parents
                });
            }
        });
    };

    self.gatherTopSelected = function () {
        ivhTreeviewBfs(treeData, function (node, parents) {
            if (node.selected) {
                topSelected.push({
                    node: node,
                    parents: parents
                });
                return false;
            }
        });
    };

    $scope.$watch(function () {
        return treeData;
    }, function () {
        self.allSelected.length = 0;
        self.topSelected.length = 0;
        self.gatherAllSelected();
        self.gatherTopSelected();
    }, true);

});

/* Styles go here */