Add support for deleting branches

[ash2014]

Can you add an API to delete branch/ branches ?

[arcseldon]

Have only briefly inspected the source code. Agreed, why is there no option in the API to remove a branch? Please can you clarify whether that is a feature you are due to publish, or else point at what would need to be done to support. Again, I will check the source code myself too but was disappointed to find this omission - I did question why this facility was not on the test page...

[rwijngaa]

I found myself needing this too. So i added the code below to abn_tree_directive.js around line 251 after tree = scope.treeControl; It just removes the children of the first branch.

tree.clear_children = function() {
   var b;
    b=tree.select_first_branch();
    n = b.children.length;
    if (n > 0) {
       b.children.splice(0, n);
     }
 };

[juhniorsantos]

add this in abn_tree_directive.js line 312

tree.remove_branch = function(b) {
     select_branch(b);
     parent = scope.treeControl.select_parent_branch();
     if(parent){
          parent.children.splice(parent.children.indexOf(b),1);
     }
};

[funkytaco]

I just used this in my code: branch.children = [];

[italoernest]

My Solution!

Alter directive:

module.directive('abnTree', [ '$timeout', function($timeout) { return { restrict: 'E', template: "<ul class="nav nav-list nav-pills nav-stacked abn-tree">\n " + "<li ng-repeat="row in tree_rows | filter:{visible:true} track by row.branch.uid" ng-animate="'abn-tree-animate'" ng-class="'level-' + {{ row.level }} + (row.branch.selected ? ' active':'') + ' ' +row.classes.join(' ')" class="abn-tree-row"><a ng-click="user_clicks_branch(row.branch)"><i ng-class="row.tree_icon" ng-click="row.branch.expanded = !row.branch.expanded" class="indented tree-icon"> <span class="indented tree-label">{{ row.label }} <i style='padding: 5px' ng-class="row.tree_icon" class='fa fa-trash pull-right'>\n", replace: true, scope: { treeData: '=', onSelect: '&', initialSelection: '@', treeControl: '='

Alter directive:

module.directive('abnTree', [ '$timeout', function($timeout) { return { restrict: 'E', template: "<ul class="nav nav-list nav-pills nav-stacked abn-tree">\n " + "<li ng-repeat="row in tree_rows | filter:{visible:true} track by row.branch.uid" ng-animate="'abn-tree-animate'" ng-class="'level-' + {{ row.level }} + (row.branch.selected ? ' active':'') + ' ' +row.classes.join(' ')" class="abn-tree-row"><a ng-click="user_clicks_branch(row.branch)"><i ng-class="row.tree_icon" ng-click="row.branch.expanded = !row.branch.expanded" class="indented tree-icon"> <span class="indented tree-label">{{ row.label }} <i style='padding: 5px' ng-class="row.tree_icon" class='fa fa-trash pull-right'>\n", replace: true, scope: { treeData: '=', onSelect: '&', initialSelection: '@', treeControl: '=' },

includ in 110 line:

scope.remove_branch = function(b) { select_branch(b); parent = scope.treeControl.select_parent_branch(); if(parent){ parent.children.splice(parent.children.indexOf(b),1); }else{ scope.treeData.splice(b,1); selected_branch = null; } };

Alter in 71 line css: ul.abn-tree li.abn-tree-row a { padding: 3px 10px; display: inline; !important; }

• Noting the differences