无限滚动离子2错误

时间:2017-03-20 14:24:58

标签: angular typescript ionic-framework ionic2 infinite-scroll

我正在尝试在我的应用程序上实现无限滚动,但我收到错误Property "then" does not exist on type "void"。当到达页面底部时,这将出现在我的文本编辑器和控制台中。这是从http get中获取的

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);
      });
  });
}

相关代码是

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();
     });
  }
}

HTML

 <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
   <ion-infinite-scroll-content></ion-infinite-scroll-content>
 </ion-infinite-scroll>

任何指针都会很棒,谢谢。

1 个答案:

答案 0 :(得分:1)

  

财产&#34;然后&#34;类型&#34; void&#34;

上不存在

您的loadRecipes方法未返回任何内容(因此无效)并且您正在尝试拨打then()...

this.loadRecipes().then(()=>{
       infiniteScroll.complete();
     });

尝试添加return关键字,如下所示:

loadRecipes(){
    return this.apiAuthentication.loadCategory1(this.start)
    .then(data => {
      this.api = data;
    });
  } 
相关问题