ionic2 + cordova 应用-列表刷新(上拉)
程序员文章站
2022-05-31 08:22:17
...
9.1 列表使用(欢迎加入Q群一起学习讨论657185219)
<ion-content> <ion-list> <ion-list-header>Follow us on Twitter</ion-list-header> <ion-item *ngFor="let i of items"> <!--<ion-icon name="ionic" item-left></ion-icon>--> @ionicframework{{i}} </ion-item> </ion-list> <ion-infinite-scroll (ionInfinite)="doInfinite($event)"> <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="上滑加载"> </ion-infinite-scroll-content> </ion-infinite-scroll> </ion-content>
9.2 控制层
export class ContactPage { items = []; constructor(public navCtrl: NavController) { for (let i = 0; i < 5; i++) { this.items.push( this.items.length ); } } doInfinite(infiniteScroll) { console.log('Begin async operation'); setTimeout(() => { for (let i = 0; i < 5; i++) { this.items.push( this.items.length ); } console.log('Async operation has ended'); infiniteScroll.complete(); }, 500); } }