加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

在每个鼠标滚动上调用angularjs – ngInfiniteScroll – loadMor

发布时间:2020-12-17 08:11:26 所属栏目:安全 来源:网络整理
导读:解决方案下面的评论。 问题:我的loadMore()方法在每个容器的滚动条上执行。 含义:loadMore()在父容器的每个鼠标滚动上执行(infinite-scroll-parent =“true”) 期望的结果:只有当infiniteScrollDistance满足其条件时,才能获取loadMore(),而不是我做的任
解决方案下面的评论。

问题:我的loadMore()方法在每个容器的滚动条上执行。

含义:loadMore()在父容器的每个鼠标滚动上执行(infinite-scroll-parent =“true”)

期望的结果:只有当infiniteScrollDistance满足其条件时,才能获取loadMore(),而不是我做的任何滚动。

我的代码高度启发了demo_basic& demo_async。

我的应用程序是一个照片库。
我通过ajax调用加载照片,并将其填充到缩略图指示中继器中。
我在控制器初始化时禁用ng-Infinite-Scroll,并在回调成功时启用它。

<div class="thumbnails grid__item page--content">
            <div id="gallery" class="unstyled-list" 
                    infinite-scroll='loadMore()' 
                    infinite-scroll-disabled='album.busy' 
                    infinite-scroll-parent="true" 
                    infinite-scroll-immediate-check="false" 
                    infinite-scroll-distance='2'>
                    <my-photo-directive ng-repeat="photo in photos"></my-photo-directive>
            </div>
    </div>

我的咖啡代码没有惊喜。
它的逻辑是不重要的,因为如果我放置一个简单的console.log,问题仍然发生…..

$scope.album.busy = true
    $scope.loadMore = ->
            $scope.$apply ->
                    $scope.album.busy = true
            console.log('loadMore() been executed here')

我的缩略图指令是一样的。没有惊喜,最后一张照片被填充到中继器上,我启用了组件。

app.directive 'myPhotoDirective',['$window',($window) ->
        return {} =
            ....
            link: (scope,element,attrs) ->
                if scope.$last
                    scope.album.busy = false

我不知道我错过了什么或做错了
我希望有人能在这里帮助我。

谢谢。

没有Plunker可以看到实际的代码,我会直接指导ngInfiniteScroll常见问题:

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>); 07000 for more details.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读