0

当在其模板中使用 < RadListView > 缓慢加载组件中的大项目列表时，用户可以通过点击导航到项目的详细信息页面，并在导航返回后得到这样的错误：

JS: ERROR Error: java.lang.IndexOutOfBoundsException: Invalid index 5, size is 2
JS:     java.util.ArrayList.throwIndexOutOfBoundsException(ArrayList.java:255)
JS:     java.util.ArrayList.add(ArrayList.java:147)
JS:     com.telerik.widget.list.ListViewAdapter.add(ListViewAdapter.java:65)

我认为这意味着组件在缓存中被“冻结”，但数据仍然来自服务的 Observable 对象。在 Component 开始继续在 listview 中创建新项目之后，它崩溃了，因为已经错过了一些。

如何正确地将数据流绑定到 RadListView 组件，当组件不活动时仍然可以加载它？我希望用户可以在加载数据的过程中导航到详细信息页面并返回...

这是模板部分：

<RadListView id="listView" [items]="listings" height="100%" class="page page-content">
    <ListViewGridLayout tkListViewLayout spanCount="{{ spanCount }}">
        <ng-template let-item="item" let-i="index">
            <StackLayout class="card-view" id="{{ i }}" listing_id="{{ item.listing_id }}" orientation="vertical" (tap)="onTap($event)">
                <Image class="card-image" src="{{ item.url_170x135 }}" height="135" width="170" stretch="aspectFill"></Image>
                <StackLayout orientation="vertical" horizontalAlignment="center">
                    <Label className="nameLabel" [text]="getTitle(item.title)"></Label>
                </StackLayout>
            </StackLayout>
        </ng-template>
    </ListViewGridLayout>
</RadListView>

这是组件代码：

listings = new ObservableArray<any>();

constructor(private productService: ProductService, private page: Page, private routerExtensions: RouterExtensions) {}

ngOnInit(): void {
    this.productService.getListingsAdopted().subscribe((item) => this.listings.push(item));
4

1 回答 1

1

刚刚添加 listView.refresh() 时返回到带有项目列表的页面：

    ngOnInit(): void {
        this.page.on("navigatedTo", (data: NavigatedData) => {
            if (data.isBackNavigation) {
                this.listView = <RadListView>(this.page.getViewById("listView"));
                this.listView.resumeUpdates(true); // works too
                // this.listView.refresh();

                return;
                ...
于 2018-11-24T14:08:20.567 回答