使用Angular 6表/网格和Web API的服务器端分页



我有一个 web api,它通过以下方式接受 GET 请求

https://myapi.net/api/childinfo/getallchildinfo/pagesize/pagenumber

这将返回一个 json 对象数组,如下所示:

[  
{  
"child":{  
"id":2832,
"childId":19979,
"motherId":20072,
"guardianId":0,
"fatherId":19549,
"childFirstName":"Hapan",
"childMiddleName":"Victoria Sue",
"childLastName":"Lafromboise",
},
"mother":{  
"id":3274,
"motherId":20072,
"motherFirstName":"Chasity",
"motherMiddleName":null,
"motherLastName":"Dumarce",
},
"father":{  
"id":2738,
"fatherId":19549,
"fatherFirstName":"gary",
"fatherMiddleName":null,
"fatherLastName":"Lafromboise",
},
"guardian":null
},
{  
"child":{  
"id":2831,
"childId":19978,
"motherId":20071,
"guardianId":0,
"fatherId":19548,
"childFirstName":"Dale",
"childMiddleName":"Michael Austin",
"childLastName":"Palmier",       
},
"mother":{  
"id":3273,
"motherId":20071,
"motherFirstName":"Glenna",
"motherMiddleName":null,
"motherLastName":"Goodsell",
},
"father":{  
"id":2737,
"fatherId":19548,
"fatherFirstName":"WILLIAM",
"fatherMiddleName":null,
"fatherLastName":"PALMIER",
},
"guardian":null
},
{  
"child":{  
"id":2830,
"childId":19977,
"motherId":20070,
"guardianId":0,
"fatherId":19547,
"childFirstName":"Jahna",
"childMiddleName":null,
"childLastName":"Grimm",
},
"mother":{  
"id":3272,
"motherId":20070,
"motherFirstName":"Casey",
"motherMiddleName":null,
"motherLastName":"Miller",
},
"father":{  
"id":2736,
"fatherId":19547,
"fatherFirstName":"John",
"fatherMiddleName":null,
"fatherLastName":"Grimm",
},
"guardian":null
}
]

网上有很多分页在客户端完成的例子,但这对我来说不是一个选择。我可以实现服务器端分页的最简单的表/网格选项是什么,如上所示?

提前非常感谢...

你试过角度材料表吗?

查看标题为"通过 HTTP 检索数据的表"的示例

最新更新