如何从角度4无限滚动服务器上获取JSON数据？

我是角4中的新角色。我想实现无限滚动角度，想要使http调用获得滚动div后的前10个项目要调用http请求获取下10项并追加到第一个数组。可以请你指导我如何做到这一点？如何从角度4无限滚动服务器上获取JSON数据？

2017-11-11 sneha pawar

可以使用例如这个库https://www.npmjs.com/package/ngx-infinite-scroll

<div infiniteScroll 
      [infiniteScrollDistance]="2" 
      [infiniteScrollThrottle]="50" 
      (scrolled)="onScroll()"> 
     </div>

然后实现onScroll()，你下一步需要加载10条记录，并将它们附加到现有阵列。

来源

2017-11-11 10:00:16

感谢您的回答。 @Anton使用ngx-infinite-scroll我得到infinitescrolldistance错误donot有div元素atrribute。我不明白为什么会发生此错误。 –

您需要在AppModule中添加InfiniteScrollModule。尝试在'ngx-infinte-scroll'中表示的例子 –

我在我的应用程序模块中添加了该模块，但仍得到相同的错误。 –

你好，我将要给你的想法或使用： https://www.npmjs.com/package/angular2-infinite-scroll

<div (window:scroll)="onScroll($event)"> 
     <li *ngFor="let item of data">{{data}}</li> 
     ... 
    </div>

，你可以叫你上滚动事件的服务和concate数据到数据阵列：

let data = []; 
    let pageNumber =1; 


    onScroll(event) { 

     myservice.getdata(pageNumber).subscribe(elements 
     => { 
      this.data.concat(elements); 
      pageNumber++ 
     }) 

    }

来源

2017-11-11 10:14:30

使用（窗口：滚动）解决方案时，我滚动窗口它每次我不想要这个时调用Onscroll方法。只想滚动特定的div。 –

我有同样的问题，如果您使用ngx-infinite-scroll，请按照https://github.com/orizens/ngx-infinite-scroll中的步骤，将模块导入您的app.module.ts

import { InfiniteScrollModule } from 'ngx-infinite-scroll';

然后在@NgModule：

@NgModule({ 
imports:[ BrowserModule, InfiniteScrollModule ], 
declarations: [ AppComponent, ], 
bootstrap: [ AppComponent ] 
})

就像我的情况下，如果你有一个以上的模块工作，并且需要特定的模块中使用，该模块中导入。

来源

2017-12-28 22:54:39 Jvick

如何从角度4无限滚动服务器上获取JSON数据？

回答

相关问题