scrollDown called many times (expected only 1)

Hi, first thx to adapt infinite-scroll to angular2, my problem is when I scroll down, the onScrollDown() function is called more than one time, I want to call it only once see my code, is something strange?:

export class App implements OnInit{
  _contactsTotal:any; // get 500 data from server
  _contactsToRepeatInView:any;
  _waitData: boolean; //no ajax call if we are already waiting one

  constructor(private _contactService: ContactService) {}

  ngOnInit():any {
    this._contactsToRepeatInView = []
    this._waitData = false;

    this._contactService.getImages().map(res => res.json()).subscribe(data => {
      this._contactsTotal = data;
      this._contactsToRepeatInView = this._contactsTotal.splice(0,100); // show only 100 data from server response
    });
  }

  onScrollDown () {

    this._contactsToRepeatInView = this._contactsToRepeatInView.concat(this._contactsTotal.splice(0,100)) // when scrollDown concat() 100 additional data to actual view, from this._contactsTotal



    if(this._contactsTotal.length === 0){ //when this._contactsTotal equal 0 we do another ajax call and so the same stuff
      this._waitData = true; //this is problem
      if(this._waitData === true){ //this is problem
        this._contactService.getImages().map(res => res.json()).subscribe(data => {
          this._waitData == false; //this is problem
          this._contactsTotal = data
          this._contactsToRepeatInView = this._contactsToRepeatInView.concat(this._contactsTotal.splice(0,100))

        });
      }
    }
  }
}

[zoehneto]

Based on your example this should work:

export class App implements OnInit{
  _contactsTotal:any; // get 500 data from server
  _contactsToRepeatInView:any;
  _waitData: boolean; //no ajax call if we are already waiting one

  constructor(private _contactService: ContactService) {}

  ngOnInit():any {
    this._contactsToRepeatInView = []
    this._waitData = false;

    this._contactService.getImages().map(res => res.json()).subscribe(data => {
      this._contactsTotal = data;
      this._contactsToRepeatInView = this._contactsTotal.splice(0,100); // show only 100 data from server response
    });
  }

  onScrollDown () {
    this._contactsToRepeatInView = this._contactsToRepeatInView.concat(this._contactsTotal.splice(0,100)) // when scrollDown concat() 100 additional data to actual view, from this._contactsTotal

    if(this._contactsTotal.length === 0){ //when this._contactsTotal equal 0 we do another ajax call and so the same stuff
      if(this._waitData === false){
        this._waitData = true;
        this._contactService.getImages().map(res => res.json()).subscribe(data => {
          this._contactsTotal = data
          this._contactsToRepeatInView = this._contactsToRepeatInView.concat(this._contactsTotal.splice(0,100))
          this._waitData = false;
        });
      }
    }
  }
}

[zoehneto]

That’s because you always set _waitData to true before checking it.