AngularJS无限滚动，仅适用于chrome全屏答案

【问题标题】：AngularJS infinite scroll, not working only with chrome fullscreenAngularJS无限滚动，仅适用于chrome全屏
【发布时间】：2014-05-28 22:19:03
【问题描述】：

我在 ng-repeat 上进行无限滚动，使用 loadMore() 函数更改 limitTo 值。

代码如下：

指令（在 jsfiddle 上找到）：

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

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

这是进入控制器的代码：

var nb = 15;
$rootScope.vue = nb;
$rootScope.loadMore = function() {
    $rootScope.vue = $rootScope.vue + 5;
}

这里是 html 中的代码：

<div class="container-fluid" id="full-2">

    <div class="row" id="full-3">
        <div class="col-xs-12 col-md-10" id="fixed" when-scrolled="loadMore()">
            <ul>
                <li ng-repeat="pg in eleves0 | search:query:['millesime']:operator | orderBy:orderProp | limitTo:vue">

                [...]

                </li>
            </ul>
        </div>
    </div>

这里是css：

html, body{
    background-color:#ccc;
    height:100%;
}

#full{
    height:100%;
}

#full-1{
    height:90%;
}

#full-2{
    height:100%;
}

#full-3{
    height:100%;
}

#fixed{
    height:100%;
    overflow: auto;
}

此代码在 IE、Firefox、Opera 上完美运行。当我向下滚动时，会出现新内容

它不适用于全屏 Chrome。如果窗口的高度

你知道它可能来自哪里吗？如何解决？

【问题讨论】：

你还有问题吗？

标签： javascript css angularjs scroll

【解决方案1】：

刚刚找到解决方案。改为：

#fixed{
height:100%;
overflow: scroll;

}

有效

【讨论】：

添加一些解释，说明此答案如何帮助 OP 解决当前问题
当用户滚动到元素中的不同位置时，会向元素发送滚动事件。它适用于窗口对象，也适用于具有溢出 CSS 属性设置为滚动（或当元素的显式高度或宽度小于其内容的高度或宽度时自动）的可滚动框架和元素。
@Gullfaxi171 问题修复与否？
@user3364329 在哪里放置这个 CSS 给出一个完整的解决方案。