javascript - Angular : binding to scroll event not working

Question

我正在尝试遵循这个jsfiddle:

http://jsfiddle.net/vojtajina/U7Bz9/

现在我的脚本文件中有这个:

var app = angular.module('my-app', [
       'scroll',
       'ui.bootstrap',
       'ngRoute']);

var scrollService = angular.module('scroll', []).directive('whenScrolled', function() {
    return function(scope, elm, attr) {
        var raw = elm[0];
        console.log("binding");

        elm.bind('scroll', function() {
          console.log("scrolling");
            if (raw.scrollTop + raw.offsetHeight >= raw.scrollHeight) {
                scope.$apply(attr.whenScrolled);
            }
        });
    };
});

HTML 文件(以 jade 表示法)具有:编辑:我添加了一个 id 和 CSS

div#lista_iniciativas.row(when-scrolled="loadMore()")

然后

#lista_iniciativas {
  overflow: auto;
}

`

事情是我可以在控制台中看到“绑定(bind)”日志，但从来没有“滚动”，即使调试我也永远无法进入绑定(bind)函数......换句话说，绑定(bind)函数永远不会触发。知道这里出了什么问题吗？我的绑定(bind)方式是否有些错误？

Answer 1

这是我发现对我有用的方法。

这可能不是最好的解决方案，@rahpuser 报告说原始帖子中的代码实际上确实有效......所以......

var scrollService = app.directive('whenScrolled', function($document, $window) {
    return function(scope, elm, attr) {
        var raw = elm[0];

        $document.bind( 'scroll', function() {
          if( ($window.innerHeight + $window.scrollY) > getDocHeight() - 100) {
                scope.$apply(attr.whenScrolled);
          } 
        });
    };
});