离子2中的无限滚动

时间:2017-03-01 06:47:48

标签: angular ionic2

我根据这个https://ionicframework.com/docs/v2/api/components/infinite-scroll/InfiniteScroll/尝试无限滚动。

一切正常,我能够显示数字和加载器。

当我尝试实现字符串数组时,我遇到错误

这是我的代码

<ion-content>

 <ion-list>
   <ion-item *ngFor="let i of items">{{i}}</ion-item>
 </ion-list>

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

</ion-content>

我的.ts文件

    items = ['apple', 'orange', '1','apple',.......];

    doInfinite(infiniteScroll) {
    console.log('Begin async operation');

    setTimeout(() => {
      for (let i = 0; i < 10; i++) {
        this.items.push( this.items.length );
      }

      console.log('Async operation has ended');
      infiniteScroll.complete();
    }, 500);
  }
  

这是我面临的错误

Argument of type 'number' is not assignable to parameter of type 'string'. 

 L35:  for (let i = 0; i < 10; i++) {
  L36:    this.items.push( this.items.length );

1 个答案:

答案 0 :(得分:1)

您无法将this.items.length设置为字符串数组。

items = ['apple', 'orange', '1','apple',.......];
items2=['dfv',...];//ten additional items for demo. the additional items can come from anywhere else eg. an http request.

    doInfinite(infiniteScroll) {
    console.log('Begin async operation');

    setTimeout(() => {
      for (let i = 0; i < 10; i++) {
        this.items.push( this.items2[i] );
      }

      console.log('Async operation has ended');
      infiniteScroll.complete();
    }, 500);
  }