新しいdivを選択すると、前のdivからアクティブなクラスを削除します

Question

divを選択するとアクティブなクラスがdivに設定されましたが、今度は新しいdivを選択するたびに以前のアクティブなクラスを削除します。

ここでは、以前に選択したdivからアクティブなクラスを削除する方法がわかりません。ツリー構造を生成するためのコードの

出典：http://jsfiddle.net/brendanowen/uXbn6/8/

テンプレート：

<table ng-repeat="data in tree track by $index"> 
    <tbody> 
     <div ng-click="setDivActive(data)" ng-class="{'active': data.selected}"></div> //This div will be selected 
    </tbody> 
    </table> 

<script type="text/ng-template" id="tree_item_renderer.html"> 
<button ng-click="add(data)">Add node</button> 
<table ng-repeat="data in data.nodes" id="tree_item_renderer.html"> 
    <tbody> 
     <div ng-click="setDivActive(data)" ng-class="{'active': data.selected}"></div> //This div will be selected 
    </tbody> 
</table> 
</script> 

コントローラー：

$scope.tree = [{name: "Node", nodes: [],selected:false}]; 
$scope.addNode = function (data) { 
     var post = data.nodes.length + 1; 
     var newName = data.name + '-' + post; 
     data.nodes.push({ name: newName, nodes: [],selected:false }); 
    }; 

$scope.setDivActive= function (data) { 
     data.selected = true; 
    }; 

Answer 1

1を選択したとして、あなたは新しいアイテムを設定する前に、コレクション全体を反復し、それらのすべてを 'not sel'に設定します関数：

function clearSelected(items) { 
    items.forEach(function(item) { 
     item.selected = false; 
     if (item.nodes) { 
      clearSelected(item.nodes); 
     } 
    }); 
} 

$scope.setDivActive= function (data) { 
    clearSelected($scope.tree); 
    data.selected = true; 
};