Question

我遇到的问题是，当滚动条到达底部附近时，它将调用结果集中的下20条记录，但是，它将前20条记录替换为新的20条记录。无限滚动的东西？这是我的逻辑：

// top-rated-movies.component.ts

// ... ... ...
import {TopRatedMoviesService} from '../../services/top-rated-movies.service';
//... ... ...

export class TopRatedMoviesComponent implements OnInit {
  topRatedMovies: Object;
  pageNum = 1;

  constructor(private _topMoviesService: TopRatedMoviesService) { }

  ngOnInit(): void {
    this._topMoviesService.getPopularMovies().subscribe(data => {
      this.topRatedMovies = data;
    });
  }

  onScrollDown() {
    this.pageNum++;
    this._topMoviesService.getPopularMovies(this.pageNum)
      .subscribe(data => this.topRatedMovies = data);
  }

}

Answer 1

制作一个数组，将来自响应的数据推送到该数组上，将该数组分配给您的视图组件，希望它可以工作。

Answer 2

您可以尝试

   // top-rated-movies.component.ts
   // ... ... ...
   import {TopRatedMoviesService} from '../../services/top-rated-movies.service';
  //... ... ...
  export class TopRatedMoviesComponent implements OnInit {
  topRatedMovies: any[] = [];
  pageNum = 1;
  constructor(private _topMoviesService: TopRatedMoviesService) { }

  ngOnInit(): void {
     this._topMoviesService.getPopularMovies().subscribe(data => {
     this.topRatedMovies = data;
  });
  }

  onScrollDown() {
   this.pageNum++;
   this._topMoviesService.getPopularMovies(this.pageNum)
    .subscribe(data => {
     this.topRatedMovies.push(data); // problem with you code is you are replace your old data with your new data so to solve this we create a array and push the data into that array so your old data remains the same  
     });
   }
  }

我希望它可以帮助您

无限滚动不保留先前的数据

2 个答案: