이오닉 2 : 무한 스크롤이 작동하지 않습니다.

Question

https://developer.yummly.com/documentation에서 데이터를 가져 오는 내 앱에 무한 스크롤을 넣으려고합니다. 최대 결과 값은 현재 50으로 설정되어 있습니다. 스크롤 지점에 도달 할 때마다 같은 양만큼 증가 시키길 원합니다.

내 API 호출

perpage: number = 50; 

loadCategory(category:any, start:number=0) { 
    var url = "http://api.yummly.com/v1/api/recipes?_app_id=...&_app_key=..."; 

    if (categoryCache[category.categoryId]) { 
     // already loaded data 
     return Promise.resolve(categoryCache[category.categoryId]); 
    } 

    // don't have the data yet 
    return new Promise(resolve => { 
     // We're using Angular HTTP provider to request the data, 
     // then on the response, it'll map the JSON data to a parsed JS object. 
     // Next, we process the data and resolve the promise with the new data. 
     var params = ""; 

     category.apiParams.forEach(paramPair => { 
     params += "&" + paramPair.key + '=' + paramPair.value; 
     }); 

     this.http.get(url + params + "&maxResult=" + this.perpage + "&start=" + start) 
     .map(res => res.json()) 
     .subscribe(data => { 
      // we've got back the raw data, now generate the core schedule data 
      // and save the data for later reference 
      console.log(data); 
      console.log(this.http.get); 
      categoryCache[category.categoryId] = data.matches; 
      resolve(categoryCache[category.categoryId]); 
     }); 
    }); 
} 

여기에서 시작하고 누군가가 그 좋은 것입니다 도움이 될 수 있다면 내 페이지 .TS 파일은

public api: any = []; 
    private start:number=50; 

    loadRecipes(){ 
    return new Promise(resolve => { 
     this.apiAuthentication.loadCategory(this.navParams.data) 
     .then(data => { 
     this.api = data; 
     }); 
    }) 
    } 


    doInfinite(infiniteScroll:any) { 

    setTimeout(() => { 
     // Text goes here 
     this.start = 100; 
     infiniteScroll.complete(); 
    }, 500); 
    } 

입니다.

Answer 1

내에서 loadRecipies으로 전화해야합니다. 모든 오류를 지우고 콘솔에서 퍼팅에서 더 50에 추가 로그인 보인다

doInfinite에서

api:any[]=[];//initialize to empty array 
loadRecipes(scroll?:any,start?:any){ 
    return new Promise(resolve => { 
     this.apiAuthentication.loadCategory(this.navParams.data,start) 
     .then(data => { 
     this.api.push(data); 
     if(scroll){ 
      scroll.complete() 
     } 
     },err=>{ 
     if(scroll){ 
      scroll.complete() 
     } 
     }); 
    }) 
    } 

,

doInfinite(infiniteScroll:any) { 
    this.loadRecipies(infiniteScroll,this.start); 
    this.start+=50; 
    }