Question

我目前正在使用NgRx数据对我项目中的几个实体执行CRUD操作。现在，我必须进行分页。因此，REST API响应将类似于：

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

AFAIK，NgRx Data与实体配合良好，我不知道如何处理。你能把我重定向到一些地方吗？谢谢。

Answer 1

即使我也面临着类似的问题。因此，对于 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 以根据索引（或任何如下所示的任何分页逻辑）过滤实体，并且可以通过 filteredEntities$ 访问结果。

//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);

在您的组件中订阅 filteredEntities$，它将解决分页问题。

我们可以在分页样式REST API响应中使用NgRx数据吗？

1 个答案: