重複StickyHeader在AngularJs

Question

所以我是比較新的AngularJs我試圖複製一個棒頭jQuery插件，我已經看到了在互聯網上使用，但由於某些原因，當我試圖做到這一點在「角」版本，它不起作用：

($window).scroll(function() { 
          var sticky = $('.sticky'), 
           scroll = ($window).scrollTop(); 

          if (scroll >= 100) sticky.addClass('fixed'); 
          else sticky.removeClass('fixed'); 

Answer 1

有很多方法可以做到這一點。這是我會怎麼做的。

HTML：

<div class="sticky"> 
    The directive will bind to this snippet by the class. 
</div> 

的Javascript：

angular.module("myApp", []) 
     .directive("sticky", ["$window", function($window){ 
      return ({ 
       link: link, 
       restrict: "C" 
      }); 
      function link(scope, element, attrs){ 
       angular.element($window).bind("scroll", function() { 
        if($window.pageYOffset >= 100){ 
         angular.element(element).addClass("fixed"); 
        }else{ 
         angular.element(element).removeClass("fixed"); 
        } 
       }); 
      } 
     }]);