5

我目前正在使用 NgRx Data 对我项目中的几个实体执行 CRUD 操作。现在，我必须开发分页。因此，REST API 响应将如下所示：

{
    "page": 1,
    "per_page": 10,
    "total": 100,
    "total_page": 10,
    "data": [
        { ... },
        { ... },
        { ... }
    ]
}

AFAIK，NgRx 数据适用于实体，我不知道如何处理这个问题。你能把我引向光明吗？谢谢你。

4

1 回答 1

0

甚至我也面临着类似的问题。因此，对于不熟悉 NgRx 数据的人，我创建了一个EntityDataListInterface，它类似于：

{
    page: number,
    per_page: number,
    total: number,
    total_page: number,
    data: EntityDataItem[]
}

对于我正在处理的每个部分，我都会创建不同的服务。让我们称之为ComponentService。在这个ComponentService中，我访问 EntityService（实现EntityCollectionServiceBase < EntityDataItem >）和实体的 DataService（实现DefaultDataService < EntityDataListInterface >）。

一旦 API 返回EntityDataListInterface数据，您就可以使用addManyToCache将它们添加到实体缓存中。

在模块内部，通过传递filterFn注册EntityDataItem。现在您可以调用setFilter来根据索引（或如下所示的任何分页逻辑）过滤实体，并且可以通过filtersEntities$访问结果。

//eds: EntityDefinitionService in the constructor

const entityMetadata: EntityMetadataMap = {
      EntityDataItem: {
        filterFn:(entities: EntityDataItem[], pattern:{startIndex: number, endIndex: number}) => {
          return entities.filter((entity, index) => {
            return ((index >= pattern.startIndex) && (index <= pattern.endIndex));
          })
        }
      }
    };
eds.registerMetadataMap(entityMetadata);

订阅您的组件中的过滤实体$，它将解决分页问题。

于 2020-12-23T09:22:27.353 回答