Как закрыть другие Accordian в угловом JS

Question

В приведенной ниже коде я использую функцию переключения, которая работает должным образом, но я хочу, чтобы закрыть другие, соответственно, когда один открыт

<div class="listing_cat" ng-controller="categoryCtrl">     
      <ul> 
       <li class="mob_main_cat" ng-repeat="x in categories" ng-click="toggleCustom($index, $event)" > 
       <span class="cat_left"> {{x.category}}</span> <span class="cat_right"><i class="fa fa-plus"></i></span> 
       <div class="clearfix"></div> 
       <ul class="mob_sub_cat" ng-show="custom[$index]"> 
        <li class="head">View all in Education</li> 
        <li ng-repeat="x in subcategories"><a href="#">{{x.subcategory}}</a></li> 

       </ul>    
       </li>    

      </ul> 
      </div> 

<script> 
$scope.custom = [];  
    $scope.toggleCustom = function(obj,event) { 
     event.stopPropagation(); 
      $scope.custom[obj] = !$scope.custom[obj];      
     }; 
</script> 

http://jsfiddle.net/U3pVM/16884/

Выше мой jsfiddle ссылка, в которой я хочу, чтобы закрыть другую, когда какой-либо один щелкают

Answer 1

Обновлено вашу скрипку с раствором, здесь:

http://jsfiddle.net/4m92fsqy/

Контроллер:

$scope.toggleCustom = function (obj, event) { 
    event.stopPropagation(); 
    var temp = $scope.categories[obj].shown 
    for (var i=0; i < $scope.categories.length; i++) { 
     $scope.categories[i].shown = false; 
    } 
    $scope.categories[obj].shown = !temp; 
}; 

HTML:

<ul class="mob_sub_cat" ng-show="categories[$index].shown"> 

Должно быть достаточно просто :)