2014-06-20 49 views
0

我使用无限滚动指令,这是代码:

angApp.directive('infiniteScroll', [ 
      '$rootScope', '$window', '$timeout', function ($rootScope, $window, $timeout) { 
       return { 
        link: function (scope, elem, attrs) { 
         var checkWhenEnabled, handler, scrollDistance, scrollEnabled; 
         $window = angular.element($window); 
         scrollDistance = 0; 
         if (attrs.infiniteScrollDistance != null) { 
          scope.$watch(attrs.infiniteScrollDistance, function (value) { 
           return scrollDistance = parseInt(value, 10); 
          }); 
         } 
         scrollEnabled = true; 
         checkWhenEnabled = false; 
         if (attrs.infiniteScrollDisabled != null) { 
          scope.$watch(attrs.infiniteScrollDisabled, function (value) { 
           scrollEnabled = !value; 
           if (scrollEnabled && checkWhenEnabled) { 
            checkWhenEnabled = false; 
            return handler(); 
           } 
          }); 
         } 
         handler = function() { 
          var elementBottom, remaining, shouldScroll, windowBottom; 
          console.log($window); 
          windowBottom = $window.height() + $window.scrollTop(); 
          elementBottom = elem.offset().top + elem.height(); 
          remaining = elementBottom - windowBottom; 
          shouldScroll = remaining <= $window.height() * scrollDistance; 
          if (shouldScroll && scrollEnabled) { 
           if ($rootScope.$$phase) { 
            return scope.$eval(attrs.infiniteScroll); 
           } else { 
            return scope.$apply(attrs.infiniteScroll); 
           } 
          } else if (shouldScroll) { 
           return checkWhenEnabled = true; 
          } 
         }; 
         $window.on('scroll', handler); 
         scope.$on('$destroy', function() { 
          return $window.off('scroll', handler); 
         }); 
         return $timeout((function() { 
          if (attrs.infiniteScrollImmediateCheck) { 
           if (scope.$eval(attrs.infiniteScrollImmediateCheck)) { 
            return handler(); 
           } 
          } else { 
           return handler(); 
          } 
         }), 0); 
        } 
       }; 
      } 
    ]); 

这段代码的问题是有时它的工作原理有时没有。如果我按Ctrl + F5进行硬刷新,它肯定会抛出下面的错误。

这是错误:

enter image description here

我使用Firefox 29.0.1。我错过了什么?

+0

您是否在angular之前包含了jquery? – XrXrXr

+0

是的,我正在使用requireJS,它在无限滚动之前加载。这里截图:http://gyazo.com/4bb9b7fedcc5d624b89b9c873c96eb72 – Jack

+0

尝试使用$(),而不是确保你使用jquery – XrXrXr

回答

1

通常情况下,这应该可行,但requireJS可能存在一些问题。改为使用$()应确保您使用的是Jquery。您可能需要order插件for requireJS,因为normally RequireJS loads and evaluates scripts in an undetermined order.