我正在尝试使用Kendo UI学习asp.net rest api和Angular。一切正常,但是我想通过向API发送take和skip作为Get参数来进行服务器端分页。
这是我对API get方法的实现:
public ResaultPage GetProducts(int skip =1, int take=20)
{
ResaultPage rp = new ResaultPage();
var count= db.Products.Count<Product>();
rp.count = count;
IPagedList<Product> x = db.Products.OrderBy(s =>
s.CategoryID).ToPagedList<Product>(skip, take);
foreach (Product v in x)
{
rp.pr.Add(v);
}
return rp;}
其中ResaultPage类包含产品列表和计数正确性。
这是我的product-service.ts获取功能:
getProducts1(skip:any, take:any ): Observable<ResaultPage> {
let params = new URLSearchParams();
params.set('Skip', skip);
params.set('Take', take);
return this.http.get<ResaultPage>(this.productsUrl)
.pipe(
tap(data => console.log(JSON.stringify(data))),
catchError(this.handleError)
);
}
,这里是product-component.ts处理函数:
public pageChange(event: PageChangeEvent): void {
this.gridState.skip = event.skip+10;
this.productService.getProducts1(this.gridState.skip,
this.gridState.take).subscribe(
sub => {
this.totalCount=sub.count;
this.products=sub.pr;
console.log(this.products);
});
运行应用程序时,我在同一页面上获得前20条记录,其中(1,2)页 当我单击2时,我仍然得到相同的结果。
例如,我只需要每页获取10个,而在第2页中仅获取10个。
剑道Ui的跳过跳过= 1且要走= 10的情况;
答案 0 :(得分:0)
在url之后,您需要再传递一个名为options
的包含参数的对象。您可以使用HttpParams发送参数
getProducts1(skip:any, take:any ): Observable<ResaultPage> {
let myparams = new HttpParams();
myparams.set('Skip', skip);
myparams.set('Take', take);
return this.http.get<ResaultPage>(this.productsUrl,{params:myparams})
.pipe(
tap(data => console.log(JSON.stringify(data))),
catchError(this.handleError)
);
}