title: Getting Ionic v4+ infinite scroll working without showing scrollbars
body: <p>Has anyone worked out how to get infinite scroll working while also hiding scrollbars?</p>
  <p>This is the scss I use to hide scrollbars:</p>
  <pre><code>ion-content {
      --padding-bottom: 200px!important;
       --offset-bottom: auto!important;
      --overflow: hidden;
       overflow: auto;
      &amp;::-webkit-scrollbar {
        display: none;
      }
    }
  </code></pre>
  <p>This is the html part:</p>
  <pre><code>...
      &lt;ion-infinite-scroll threshold=&quot;10px&quot; (ionInfinite)=&quot;loadData($event)&quot;&gt;
          &lt;ion-infinite-scroll-content
            loadingSpinner=&quot;lines&quot;
            loadingText=&quot;Loading more data...&quot;&gt;
          &lt;/ion-infinite-scroll-content&gt;
        &lt;/ion-infinite-scroll&gt;
  </code></pre>
  <p>and this is the .ts:</p>
  <pre><code>import { Component, ViewChild,OnInit } from '@angular/core';
  import { IonInfiniteScroll , IonContent,ModalController} from '@ionic/angular';
  ...
  export class GlobalRankingsPage implements OnInit {
    @ViewChild(IonInfiniteScroll) infiniteScroll: IonInfiniteScroll;
    @ViewChild(IonContent) content: IonContent;
  ...
  loadData(event) {
      if(this.nextPage!=null){
        setTimeout(() =&gt; {
  
        this.globalRank(); //this just adds records to the dataList
        event.target.complete();
        if (this.dataList.length &gt;= 150) {
          event.target.disabled = true;
        }
      
        }, 300);
      }else{
        event.target.disabled = true;
        event.target.complete();
      }
    }
   
    toggleInfiniteScroll() {
      this.infiniteScroll.disabled = !this.infiniteScroll.disabled;
    }
  ...
  </code></pre>
  <p>If I remove the css (so scrollbars show) the infinite scroll works fine. But if I hide the scrollbars the loadData function doesn’t get triggered.</p>
  <p>Thanks!</p>