Question

我使用http://binarymuse.github.io/ngInfiniteScroll v1.1.0中的无限滚动。我有一个表，其内容将在用户向下滚动时动态加载。

我在这个plunk中做了同样的事情，它将数据推送到div中显示的数组中，并且按预期工作正常。

当我尝试在其他页面上执行相同操作时，showMore（）函数不仅在向下滚动时被调用，而且在向上滚动时也被调用。这里是表的结构。

<table>
    <thead>
        <tr>
            <th>Some heading</th>       
            <th>Some other heading</th>
        </tr>
    </thead>
    <tbody>
      <div infinite-scroll="showMore()" infinite-scroll-distance="3" infinite-scroll-disabled='infiniteScrollDisabled'>
        <tr ng-repeat="r in report">
            <td>{{$index}}</td>    
            <td">{{r.someData}}</td>
        </tr>
      </div>
    </tbody>
</table>

我不明白为什么即使在向上滚动时调用showMore()函数也是如此。它与表结构有什么关系吗？

Answer 1

解决方案就是搬家 <div infinite-scroll="showMore()" infinite-scroll-distance="3" infinite-scroll-disabled='infiniteScrollDisabled'>

在<table>.....</table>代码之外。

Answer 2

我在github上发现了这个问题，它为我解决了这个问题 https://github.com/sroze/ngInfiniteScroll/issues/157

<div class="constrained" ng-controller="MyCtrl">
    <table infinite-scroll="increaseLimit()" infinite-scroll-container='".constrained"'>
        <tr ng-repeat="item in items | limitTo:barLimit">
            <td>Number</td>
            <td>{{item.number}}</td>
        </tr>
    </table>
</div>

信用：BenjaminWFox

这个jsFiddle演示了这个（以及过滤等）https://jsfiddle.net/lisapfisterer/Lu4sbxps/

即使在向上滚动时，AngularJS无限滚动调用也会起作用

2 个答案: