javascript - ng Infinite Scroll、Bootstrap 3 和 AngularJS 的高度问题

标签 javascript html css angularjs twitter-bootstrap

我正在实现 ng Infinite Scroll module在我的应用程序中,我遇到了几个问题。

我目前的问题是该函数将在每个滚动事件中触发。 我在 module FAQ 中发现了对这个问题的提及。 ,但到目前为止包含一个 div 的解决方案 clear:both;在容器的末端没有帮助。

这是来自常见问题解答的引述:

Why is ngInfiniteScroll triggering my expression on every single scroll event?

The infiniteScroll directive uses the height of the element that it's attached to in order to determine how close to the bottom of the window it is. In some cases, the browser can report a height of 0, which causes this behavior. Usually, this is due to a container element that only contains floated children. The simplest way to fix this problem is to add a "spacer" element to the bottom of the container (something like div style='clear: both;' /div); see this StackOverflow question and its associated answers for more details.

想看一看并阐明问题吗?

这是我的函数和一个有效的 Plunker .

    var _page = 0;
    $scope.releases = [];
    $scope.loadDetails = function(id) {
        _page++;
        console.log(_page);
        $http.get('http://api.discogs.com/artists/' + id + '/releases?page=' + _page + '&per_page=12').then(function(data2) {
            $scope.releases = data2.releases;
        });
    };    

最佳答案

我相信无限滚动在这里不是问题。 我已经修复了您的代码中的一些问题,请参阅 plunk ,在我看来一切都很正常。

关于javascript - ng Infinite Scroll、Bootstrap 3 和 AngularJS 的高度问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23015570/

相关文章:

javascript - 简化代码

javascript - 如何用href定位div加载

jquery - Bootstrap 3 自定义多级菜单不适用于较小的分辨率

html - CSS 在纵向模式下的小屏幕上添加自动边距

javascript - 在 Python 和 Javascript 中使用 Selenium 在 Quora 上无限滚动

javascript - HTML CSS - 如何使 iframe 内容适合 iframe

javascript - 如何将 jQuery this 与 .on 函数和 .each 函数一起使用

javascript - AngularJS - 提交按钮未禁用(我是新手)

javascript - 为初始编译后创建的元素创建 2 路绑定(bind)

css - 浏览器比例影响宽度