延遲角度指令執行

Question

延遲指令運行的最佳方式是什麼？在指令執行之前需要等待的狀態之間有一個小的延遲，否則會弄亂滾動。我試圖使用$timeout，但似乎可以用它錯了，因爲它會引發錯誤...

app.directive('scrolltop', function() { 
    return { 
     restrict: 'A', 
     link: function(scope, element) { 
      element.on('click', function() { 
       console.log('scrolltop'); 
       $('html, body').animate({ 
        scrollTop: $(element).offset().top - 50 
       }, 2000); 
      }); 
     }, 
    } 
}); 

Answer 1

我寫了使用$timeout一個簡單的例子（向下滾動div和點擊背景）。

HTML：

<div ng-app="TestDebounce"> 
    <div scrolltop class="scrolltop"> 
     <span>...</span> 
    </div> 
</div> 

角指令：

(function() { 
    angular.module('TestDebounce', []).directive('scrolltop', scrolltop); 
    scrolltop.$inject = ['$timeout']; 

    function scrolltop($timeout) { 
     return { 
      restrict: 'AE', 
      link: linkFunction 
     } 

     function linkFunction(scope, element) { 
      element.on('click', function() { 
       $timeout(function() { 
        $('html, body').animate({ 
         scrollTop: $(element).offset().top - 50 
        }, 'fast'); 
       }, 2000); // 2 seconds timeout 
      }); 
     } 
    } 

}()); 

JS小提琴link - 嘗試。