Question

我想制作一个列表，当我到达列表底部时，它应显示一些项目。我正在使用ion-infinite-scroll指令。但是我无法在列表中推送名称（字符串）。我的名单只是教室里所有学生的名字。这是我的代码。你可以告诉我如何在我的列表中推送字符串以及如何调用complete()方法？

html的

            <h2>{{item.name}}</h2> 
        </ion-item>
    </ion-list>
    <ion-infinite-scroll (ionInfinite)="loadMore($scope)">
        <ion-infinite-scroll-content>
        </ion-infinite-scroll-content>
    </ion-infinite-scroll>

.TS

export class NotificationsPage {
i: number;
items: any = [];
name: any;
InfiniteScroll: any;
constructor(public navCtrl: NavController, public navParams: NavParams) {
    for (let i = 0; i < 10; i++) {
        let item = {
            name:i,
        };
        this.items.push(item);
    }

    this.InfiniteScroll.complete()


}
loadMore(InfiniteScroll: any) {
    this.objects.items.push({this.items});

};

ionViewDidLoad() {
    console.log('ionViewDidLoad NotificationsPage');
};

}

Answer 1

这样做 - plunker

<强> HTML

<ion-content padding>
    <ion-list *ngFor="let item of items">
        <h2>{{item?.name}}</h2>
    </ion-list>
    <ion-infinite-scroll (ionInfinite)="loadMore($event)">
        <ion-infinite-scroll-content>
        </ion-infinite-scroll-content>
    </ion-infinite-scroll>
</ion-content>

TS：

import {  Component } from '@angular/core';
import {  NavController } from 'ionic-angular';

@Component({
    selector: 'page-home',
    templateUrl: 'app/home.page.html'
})
export class HomePage {
    items: any = [];
    constructor(public navCtrl: NavController) {}
    load() {
        for (let i = 0; i < 10; i++) {
            let item = {
                name: i,
            };
            this.items.push(item);
        }
    }
    loadMore(InfiniteScroll: any) {

        this.load();
        InfiniteScroll.complete();
    };

    ionViewDidLoad() {
        this.load();
    };
}

使用InfiniteScroll将字符串作为离子列表中的项目推送

1 个答案: