如何在Nativescript中重新启动按需加载?

时间:2019-09-26 01:20:22

标签: angular mobile nativescript angular2-nativescript radlistview

我有一个Radlistview,其中的数据根据​​用户在日历中选择的日期进行更改。

我正在使用loadOnDemandMode = "Manual",在当前查询用尽之前,它可以正常工作。发生这种情况时,我使用listView.notifyLoadOnDemandFinished (true),但是如果用户尝试选择另一天,则无法再次使用“按需加载”。

我已经尝试再次实例化ObservableArray,但是它不起作用。如果知道如何重新启动按需加载,我会很感激

我遵循THIS创建代码,并尝试了THIS,但对我来说不起作用。我的代码是这样的

<RadListView [items]="dataItems" 
loadOnDemandMode="Manual" 
(loadMoreDataRequested)="onLoadMoreItemsRequested($event)">
export class ListViewFixedSizeManualComponent implements OnInit {
    private _dataItems: ObservableArray<DataItem>;
    private _sourceDataItems: ObservableArray<DataItem>;
    private layout: ListViewLinearLayout;

    constructor(private _changeDetectionRef: ChangeDetectorRef) {
    }

    ngOnInit() {
        this.layout = new ListViewLinearLayout();
        this.layout.scrollDirection = ListViewScrollDirection.Vertical;
        this.initDataItems();
        this._changeDetectionRef.detectChanges();
        this._dataItems = new ObservableArray<DataItem>();
        this.addMoreItemsFromSource(6);
    }

    public get dataItems(): ObservableArray<DataItem> {
        return this._dataItems;
    }


    public addMoreItemsFromSource(chunkSize: number) {
        let newItems = this._sourceDataItems.splice(0, chunkSize);
        this.dataItems.push(newItems);
    }

    public onLoadMoreItemsRequested(args: LoadOnDemandListViewEventData) {
        const that = new WeakRef(this);
        const listView: RadListView = args.object;
        if (this._sourceDataItems.length > 0) {
            setTimeout(function () {
                that.get().addMoreItemsFromSource(2);
                listView.notifyLoadOnDemandFinished();
            }, 1500);
        } else {
            args.returnValue = false;
            listView.notifyLoadOnDemandFinished(true);
        }
    }

    private initDataItems() {
        this._sourceDataItems = new ObservableArray<DataItem>();
        for (let i = 0; i < posts.names.length; i++) {
            if (androidApplication) {
                this._sourceDataItems.push(new DataItem(i, posts.names[i], "This is item description", posts.titles[i], posts.text[i], "res://" + posts.images[i].toLowerCase()));
            }
            else {
                this._sourceDataItems.push(new DataItem(i, posts.names[i], "This is item description", posts.titles[i], posts.text[i], "res://" + posts.images[i]));
            }
        }
    }
}

1 个答案:

答案 0 :(得分:0)

我解决了从true中删除listView.notifyLoadOnDemandFinished()选项并添加选项ListViewLoadOnDemandMode.None的问题,因此当我更改日期时,只需再次添加ListViewLoadOnDemandMode.Manual < / p>

      if (this.getHistoricData.length > 0) {
        setTimeout(function () {
          that.get().addMoreItemsFromSource(10);
          listView.notifyLoadOnDemandFinished();
        }, 1500);
      } else {
        list.listView.loadOnDemandMode = ListViewLoadOnDemandMode.None;
        listView.notifyLoadOnDemandFinished();

参考:nativescript-ui-samples-angular