具有后端API JSON的绑定角垫分页器

Question

在我的应用程序中，我有一个Spring REST Controller，它以JSON格式公开数据，这些数据已经以分页格式提供；在我的Angular前端中，我已经声明了mat-paginator组件以获取来自后端的传入数据，但是据我所知，到目前为止，mat-paginator自行处理页面格式（例如，如果我声明一个由20个模拟元素组成的数组并将mat-paginator页面设置为10个元素，Angular提供了将页面计数处理为'2'的值），但我想使此东西与已经提供的后端页面兼容格式，即使在前端也无需自定义。有可能这样做吗？还是我需要以未分页的格式传递元素的整个列表，以便直接在前端创建页面？这是来自后端的页面结果的代码：

{
  "content": [
    {
      "id": 89461,
      "name": "eu",
      "address": "73258 South Fairbanks Ct.",
      "tel_number": 330362914,
      "coordinates": {
        "type": "Point",
        "coordinates": [
          44.92497,
          36.1748
        ]
      },
      "creation_date": "2010-11-18"
    },
    {
      "id": 99459,
      "name": "montes",
      "address": "28683 South Nauru Way",
      "tel_number": 328650809,
      "coordinates": {
        "type": "Point",
        "coordinates": [
          34.26616,
          60.14567
        ]
      },
      "creation_date": "2010-11-18"
    },
    {
      "id": 13366,
      "name": "massa",
      "address": "20549 East Liberia Blvd.",
      "tel_number": 333236540,
      "coordinates": {
        "type": "Point",
        "coordinates": [
          53.24598,
          38.3594
        ]
      },
      "creation_date": "2010-11-19"
    },
    {
      "id": 31927,
      "name": "tempor",
      "address": "48262 South Barbados Ct.",
      "tel_number": 327365240,
      "coordinates": {
        "type": "Point",
        "coordinates": [
          42.17593,
          45.67655
        ]
      },
      "creation_date": "2010-11-19"
    },
    {
      "id": 16455,
      "name": "vehicula",
      "address": "63846 West Costa Rica Way",
      "tel_number": 333771974,
      "coordinates": {
        "type": "Point",
        "coordinates": [
          50.84762,
          -3.74278
        ]
      },
      "creation_date": "2010-11-19"
    },
    {
      "id": 4068,
      "name": "elementum",
      "address": "39129  Henderson Blvd.",
      "tel_number": 333345108,
      "coordinates": {
        "type": "Point",
        "coordinates": [
          17.93082,
          17.60466
        ]
      },
      "creation_date": "2010-11-20"
    },
    {
      "id": 39076,
      "name": "eros",
      "address": "75697 East Greece St.",
      "tel_number": 333710853,
      "coordinates": {
        "type": "Point",
        "coordinates": [
          35.36623,
          15.51502
        ]
      },
      "creation_date": "2010-11-20"
    },
    {
      "id": 58449,
      "name": "sit",
      "address": "69309 East Aruba St.",
      "tel_number": 332365281,
      "coordinates": {
        "type": "Point",
        "coordinates": [
          16.37542,
          21.24491
        ]
      },
      "creation_date": "2010-11-21"
    },
    {
      "id": 17085,
      "name": "magna",
      "address": "82350 West Falkland Islands (Malvinas) Ln.",
      "tel_number": 333290644,
      "coordinates": {
        "type": "Point",
        "coordinates": [
          50.665,
          12.32584
        ]
      },
      "creation_date": "2010-11-21"
    },
    {
      "id": 11438,
      "name": "massa",
      "address": "54294  Billings St.",
      "tel_number": 331961026,
      "coordinates": {
        "type": "Point",
        "coordinates": [
          52.1453,
          43.26645
        ]
      },
      "creation_date": "2010-11-21"
    }
  ],
  "pageable": {
    "sort": {
      "unsorted": true,
      "sorted": false,
      "empty": true
    },
    "offset": 0,
    "pageSize": 10,
    "pageNumber": 0,
    "paged": true,
    "unpaged": false
  },
  "last": false,
  "totalPages": 853,
  "totalElements": 8522,
  "sort": {
    "unsorted": true,
    "sorted": false,
    "empty": true
  },
  "number": 0,
  "size": 10,
  "numberOfElements": 10,
  "first": true,
  "empty": false
}

Answer 1

很确定，您必须创建自己的包装器组件才能使物料台/分页器适应您的需求。根本不是框架工作来处理任何传入的数据格式，例如弹簧。也许已经有一个npm软件包已经在做，但是有角度的材料框架肯定会在没有任何包装的情况下做到这一点。

编辑：显然，只有在您不想在后端分页时，才会出现这种情况。如果您获取整个列表，则应该没有任何问题。