为什么这个指令只适用于一个元素？

Question

我试图揭示项目，因为他们在我的角度应用程序中滚动时进入视图。问题是，只要第一个元素显示出来，所有元素似乎都会显露出来。我究竟做错了什么？

这里有一个plnkr：http://plnkr.co/edit/nETvkzqKZvak5B6I4QpV

更新：我得到它的工作。有没有人有任何关于如何提高性能的想法。这很刺激。

.directive("scrollFade", function($window) { 
    return function(scope, element, attrs) { 
     angular.element($window).bind("scroll", function() { 
     var bottom_of_object = $(element).offset().top + $(element).outerHeight(); 
     var bottom_of_window = $(window).scrollTop() + $(window).height(); 
     if (bottom_of_object < bottom_of_window) { 
      //in view 
      element.css('opacity', 1); 
     } else { 
      //outside of view 
      element.css('opacity', 0); 
     } 
     scope.$apply(); 
     }); 
    }; 
    }); 

Answer 1

您可以使用函数像防抖动从lodash或下划线库（http://lodash.com/docs#debounce），可以提高你的表现了一下。