Question

我们准备了一个带角度2的Kendo UI Grid绑定演示。在本演示中，我们使用了自定义分页，页面大小为250。当我们移动到Grid中的下一页时，内存使用量每次都会增加。在某些时候，滚动变慢，应用程序也崩溃了。那么当我移动到下一页或上一页时，有没有办法清除网格数据？或者任何其他方式在网格中获得更好的性能，大量的页面大小超过500。

我们还尝试了this.gridData.next（[]）来清除网格数据。但.next（）函数不支持Observable。

请为它提供演示。

以下是我们用于绑定网格和自定义分页的代码。

Code in app.module.ts file. 
public query(config: any): void {
    this.getTask(config)
        .subscribe(x => super.next(x));

}
private getTask(config: any): Observable<GridDataResult> {
    let params = new URLSearchParams();
    params.set('Skip', config.skip);
    params.set('Take', config.take);      

    this.http.get(`${this.TaskCount_URL}`)
        .map(response => response.json())
        .subscribe(result => this.total = result);

    return this.http.get(`${this.TaskDetail_URL}`, { search: params })
        .map(this.extractData)
        .map(response => (<GridDataResult>{
            data: response,
            total: this.total
        }));
}

Code in app.Component.ts file
public onNextClick(event: any) {
    this.skip = this.skip + 1000;
    this.gridData = this.service;
    this.service.query({ skip: this.skip, take: this.pageSize, sort: this.sort });
}

Answer 1

稍微更改您的查询功能。

从此。

public query(config: any): void {
    this.getTask(config)
        .subscribe(x => super.next(x));

}

对此。

public query(config: any): void {
    super.next(data: [], total: 0);    
    this.getTask(config)
        .subscribe(x => super.next(x));
}

这会在等待下一页数据时将网格设置为空。另一个警告是确保您永远不会向行为主题发送错误。如果这样做，它将停止处理任何其他内容。最好的做法可能就是这样。

public query(config: any): void {
    super.next(data: [], total: 0);    
    this.getTask(config)
        .subscribe(
            x => super.next(x),
            err => {
                //notify user of error some other way.
                alert("Error retrieving grid data");
                super.next(data: [], total: 0);
            }
        );
}

当我们改变网格的分页时，我们如何清除角度2的kendo UI Grid

1 个答案: