Question

我正在关注this教程，但不确定是否过时。

我正在使用@angular/core": "^5.2.0"，所以我正在使用此版本ngx-infinite-scroll@0.8.3

我添加了：

import { InfiniteScrollModule } from 'ngx-infinite-scroll'; 并将InfiniteScrollModule导入app.module.ts中。

在Search.component.ts中，我添加了directives: [InfiniteScroll] tp @Component，但是当我浏览“ ngx-infinite-scroll”中的选项时，它似乎不再存在参见InfiniteScrollDirective，但未实现。

我可以编译应用程序的唯一方法是摆脱directives: [InfiniteScroll]，但无限滚动不起作用（这只是普通滚动）。

HTML：

<div class="search-results"
     infiniteScroll
     [infiniteScrollDistance]="2"
     [infiniteScrollThrottle]="50"
     (scrolled)="onScroll()">
  <div *ngFor="let name of ['a','a','b','e','r','t','t','e','b','e','r','t','ererer','a','a','b','e','r','t','t','e','b','e','r','t','ererer']">
    <div>
      {{name}}
    </div>
  </div>
</div>

CSS：

.search-results {
  height: 100px;
  overflow-y: scroll;
}

我的问题是什么使无限滚动成为可能？

Answer 1

您不需要directives: [InfiniteScroll]。在模块内部导入就足够了。

关于滚动本身-是否看到对您定义的函数（onScroll()）的调用？

基本上，只要在视口中显示包含指令的元素的特定百分比（默认为80％），该指令就会调用(scrolled)函数。

例如，如果您有一个高度为500px的表格，则当其中400px的表格进入视口（在屏幕上看到的内容）时，将调用滚动功能。

如何使用角度为5+的无限滚动？

1 个答案: