将Angular Mat Paginator与后端API JSON绑定

在我的应用程序中，我有一个SpringREST控制器，它以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
}

---

可以肯定的是，您必须创建自己的包装器组件，以使材质表/分页器适应您的需要。处理任何传入的数据格式（如spring）根本不是框架的工作。可能有一个npm包已经在做这项工作，但angular material framework在没有任何包装的情况下肯定不会做这项工作

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