I have been attempting to incorporate infinite scrolling into my application, but I keep encountering an error that says
Property "then" does not exist on type "void"perpage:number = 50;
loadCategory1(start:number=0) {
var url = "http://api.yummly.com/v1/api/recipes?_app_id=////&_app_key=////";
if (this.Category1) {
return Promise.resolve(this.Category1);
}
return new Promise(resolve => {
this.http.get(url + "&allowedAllergy[]=396^Dairy-Free&allowedAllergy[]=393^Gluten-Free&maxResult=" + this.perpage + "&start=" + start)
.map(res => res.json())
.subscribe(data => {
console.log(data);
this.Category1 = data.matches;
resolve(this.Category1);
});
});
}
The code snippet associated with this problem is as follows:
export class Category1Page {
public api: any;
private start:number=0;
constructor(public navCtrl: NavController, public navParams: NavParams, public apiAuthentication: ApiAuthentication) {
this.loadRecipes();
}
loadRecipes(){
this.apiAuthentication.loadCategory1(this.start)
.then(data => {
this.api = data;
});
}
doInfinite(infiniteScroll:any) {
console.log('doInfinite, start is currently '+this.start);
this.start+=50;
this.loadRecipes().then(()=>{
infiniteScroll.complete();
});
}
}
In the HTML section:
<ion-infinite-scroll (ionInfinite)="doInfinite($event)">
<ion-infinite-scroll-content></ion-infinite-scroll-content>
</ion-infinite-scroll>
If anyone has any advice or suggestions, it would be greatly appreciated. Thank you.