Событие "ionScroll" в ионной прокрутке Ionic2

Question

Хорошо, я хочу огонь ionScroll в директиве ion-scroll, Но это не работает.

Есть идеи, как я могу работать с этим???

API: https://ionicframework.com/docs/api/components/scroll/Scroll/

Answer 1

Я опубликую это на тот случай, если вы или кто-то еще ищете ответ.

Есть ion-infinite-scroll Вы можете использовать, но это относится только к ion-content Вы можете использовать его, если он вам подходит.

Однако, если вы действительно хотите получить событие от ion-scroll Вы можете попробовать что-то вроде этого: /questions/10339008/ionic-2-scroll-event/10339015#10339015

Если вы хотите проверить, когда достигнете нижней части свитка, вы можете добавить фиктивный элемент и проверить, находится ли он около нижней части свитка. Смотрите пример ниже.

  ...
  @ViewChild(Scroll) ionScroll: Scroll;
  @ViewChild("endOfScroll") endOfScroll: ElementRef;
  updating: Boolean = false;
  private threshold: number = 0.01; //1% This is similar to ion-infinite-scroll threshold 
  ...
  ionViewDidLoad() { 
      this.ionScroll.addScrollEventListener(this.scrollHandler.bind(this));
  }
  ...
  scrollHandler(evenman){
    let endOfScroll = this.endOfScroll.nativeElement.getBoundingClientRect();
    let ionScroll = this.ionScroll._scrollContent.nativeElement.getBoundingClientRect();
    let clearance = 1 - ionScroll.bottom/endOfScroll.bottom;
    if(clearance <= this.threshold){
      this.updating = true;
      // DO your work here
      console.log(JSON.stringify({fen: endOfScroll.bottom, lis: ionScroll.bottom}));
      this.updating = false;

    }
  }
...

...
      <ion-scroll scrollY="true">
        <ion-list>
          <ion-item-sliding *ngFor="let machann of lisMachann.lisMachann  let endeks = index" [class.active]="endeks == endeksKlik">
            <ion-item (click)="ouveFenet(endeks)">
            ...
            </ion-item>
            <ion-item-options side="left">
            ...
            </ion-item-options>
          </ion-item-sliding>
          <ion-item *ngIf="updating">
            <ion-spinner class="loading-center"></ion-spinner>
          </ion-item>
        </ion-list>
        <div #endOfScroll></div>
      </ion-scroll>
...