如何从角度4的无限滚动中获取服务器的json数据?

问题描述 投票:0回答:3

我是角度4的新手。我想在角度中实现无限滚动,想要在滚动div之后使http调用获得前10个项目想要调用http请求获取下10个项目并追加到第一个数组。你能指导我怎么做吗?

angular
3个回答
1
投票

我有同样的问题,如果你正在使用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 ]
})

与我的情况一样,如果您使用多个模块并且想要在特定模块中使用,请在该模块中导入它。


0
投票

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

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

然后实现onScroll(),您需要加载下10条记录并将它们附加到现有数组。


0
投票

你好我会给你一个想法或使用:https://www.npmjs.com/package/angular2-infinite-scroll

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

您可以在滚动事件上调用您的服务并将数据连接到数据数组:

   let data = [];
   let pageNumber =1;


    onScroll(event) {

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

     }
© www.soinside.com 2019 - 2024. All rights reserved.