角度手風琴沒有關閉

Question

我有一個簡單的Angularjs手風琴，它在過去的項目中工作得很好（使用<div>而不是現在使用<li>'s）。手風琴打開/滑落，但不再滑動。

這裏有一個plunker：http://plnkr.co/edit/rIKIwYLowORhag7qu9Fy?p=preview

單擊+上plunker擴大。

JS：

app.directive('sliderContentDirective', function() { 
    return { 
     restrict:'A', 
     compile: function (element, attr) { 
      // wrap tag 
      var contents = element.html(); 
      element.html('<li class="slideable_content" style="margin:0 !important; padding:0 !important" >' + contents + '</li>'); 
      //element.html('<tr class="slideable_content" style="margin:0 !important; padding:0 !important" >' + contents + '</tr>'); 

      return function postLink(scope, element, attrs) { 
       // default properties 
       attrs.duration = (!attrs.duration) ? '0.7s' : attrs.duration; 
       attrs.easing = (!attrs.easing) ? 'ease-in-out' : attrs.easing; 
       element.css({ 
        'overflow': 'hidden', 
        'height': '0px', 
        'transitionProperty': 'height', 
        'transitionDuration': attrs.duration, 
        'transitionTimingFunction': attrs.easing 
       }); 
      }; 
     } 
    }; 
}); 

app.directive('sliderToggleDirective', function($document, $timeout, $animate) { 
    return { 
     restrict: 'AE', 
     scope: { 
      target: "@" 
     }, 
     link: function(scope, element, attrs) {    

      var timeoutFunc = function() { 
       var target = angular.element($document[0].querySelector("#" + scope.target))[0]; 

       attrs.expanded = false; 
       element.bind('click', function() { 
        var content = target.querySelector('.slideable_content'); 
        var y = content.clientHeight; 
        target.style.height = y + 'px'; 
        if(!attrs.expanded) { 
         content.style.border = '1px solid rgba(0,0,0,0)'; 
         content.style.border = 0; 
        } 
        else { 
         $animate.removeClass(angular.element(target), 'auto', function(){$timeout(closeAccordionFunc);}); 
        } 

        attrs.expanded = !attrs.expanded; 
        if (attrs.expanded) { 
         $timeout(adjustHeightFunc, 800); 
        } 
       }); 
      } 

      var adjustHeightFunc = function() { 
       var target = angular.element($document[0].querySelector("#" + scope.target))[0]; 
       var content = target.querySelector('.slideable_content'); 
       $animate.addClass(angular.element(target), 'auto'); 
      } 

      var closeAccordionFunc = function() { 
       var target = angular.element($document[0].querySelector("#" + scope.target))[0]; 
       target.style.height = '0px'; 
      } 

      $timeout(timeoutFunc, 0); 
     } 
    } 
}); 

Answer 1

不知道爲什麼這個函數是在那裏擺在首位，但得到它通過移動它的工作。

這條線：

$animate.removeClass(angular.element(target), 'auto', function(){$timeout(closeAccordionFunc);}); 

這一行：

$animate.removeClass(angular.element(target), 'auto'); 
$timeout(closeAccordionFunc);