Quantcast
Viewing all articles
Browse latest Browse all 70874

How to implement infiniteScroll - Ionic 2

@JosephMendez wrote:

Please help me how to implement infinitescroll:

Asynchronous data: Total items is 30, first display is 6 items

Request:
- offset:0
- display per scroll is 6 items
- each scroll will add 6 more items.

  showProductsMore(){

       var params = params || {};
       params['filter[limit]'] = 6;
      /* params['filter[offset]']
      here i don't know how*/

      this.woo.getData('/products', 'GET', params).subscribe(
      data => {
          this.listProducts = data;
          /* i dont know how to implement the infinitescroll here*/
      })
  }

In View:

 <ion-row class="products-grid">
    <ion-col  width-50  *ngFor="#row of listProducts" (click)="productDetails(row)">
        <div class="produc-list">
          <div class="product-image"><img src="{{row.featured_src}}"/></div>
          <div class="product-title">{{row.title}}</div>
          <div class="product-price">
            <span  [innerHTML]="row.price_html"></span>
          </div>
        </div>
    </ion-col>
    </ion-row>
    /* I stucked here */
    <ion-infinite-scroll *ngIf="showProductsMore()"
    (infinite)="loadMoreProducts($event,pagenumber)">
    <ion-infinite-scroll-content
     loadingSpinner="bubbles"
     loadingText="Loading more data..." ></ion-infinite-scroll-content>
    </ion-infinite-scroll>

`

Posts: 2

Participants: 2

Read full topic


Viewing all articles
Browse latest Browse all 70874

Trending Articles