带有 Django REST API 的 Angular 2/5 智能表

【问题标题】：Angular 2/5 Smart Table with Django REST API带有 Django REST API 的 Angular 2/5 智能表
【发布时间】：2018-06-26 15:27:19
【问题描述】：

我正在寻找一个访问 Django REST API 提供的 API 的智能表示例。由于我的数据库非常大，所以有服务器端的分页和过滤是非常重要的。

我的 API 的 JSON 响应

{
    "count": 11512,
    "next": "http://127.0.0.1:8000/api/icd/?page=2",
    "previous": null,
    "results": [
        { ...

你能帮我做一个小动作吗？

【问题讨论】：

您是否尝试收集响应角度收集的结果并从中创建智能表？
我想我已经做到了。但随后我的网站将永远加载。因为没有服务器端分页的“get”命令会将所有元素加载到一个数组中。我没有使用分页。

标签： django angular django-rest-framework

【解决方案1】：

根据 rest-framework 文档，您可以在 settings.py 文件中设置分页样式：

REST_FRAMEWORK = {
    'DEFAULT_PAGINATION_CLASS': 'rest_framework.pagination.LimitOffsetPagination',
    'PAGE_SIZE': 100
}

您也可以设置分页类并将它们设置为您的 Views pagination_class 属性：

class LargeResultsSetPagination(PageNumberPagination):
    page_size = 1000
    page_size_query_param = 'page_size'
    max_page_size = 10000

class StandardResultsSetPagination(PageNumberPagination):
    page_size = 100
    page_size_query_param = 'page_size'
    max_page_size = 1000

并查看：

class BillingRecordsView(generics.ListAPIView):
    queryset = Billing.objects.all()
    serializer_class = BillingRecordsSerializer
    pagination_class = LargeResultsSetPagination

【讨论】：

你怎样才能把它放到 Angular 前端的可过滤表中？