@ ngrx/data-如何扩展集合精简器/替换对数据服务调用结果的处理? [英] @ngrx/data - how can I extend a collection reducer / replace handling of the results of a data service call?

查看:157
本文介绍了@ ngrx/data-如何扩展集合精简器/替换对数据服务调用结果的处理?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

使用 @ ngrx/data 我想以不同于默认值的方式处理 getWithQuery API调用的结果.

当前如果返回实体数组,则直接将其加载到 entityCache 中.

到目前为止,我已经使用了

我的理解是,为每个提供 EntityCollectionDataService 接口的实体创建并注册了一个默认的reducer.使用 add/delete/getAll/getById/getWithQuery/update 方法.

我想保留这些方法,但重写 getWithQuery 简化器以实现我的目标.

自定义实体化简行为

但是很多时候,您都希望使用在运行之前或之后运行的其他附加reducer逻辑来扩展collection reducer.

这实际上如何完成?

如果我尝试在我的 PurchaseOrderService

中覆盖 getWithQuery ,我仍然会收到上述错误

  getWithQuery(params){返回super.getWithQuery(params).pipe(tap(result => console.log(result)));} 

解决方案

使用自定义的 EntityDataService

  @Injectable()导出类PurchaseOrderDataService扩展了DefaultDataService<采购订单>{构造函数(http:HttpClient,httpUrlGenerator:HttpUrlGenerator,记录器:记录器,配置:DefaultDataServiceConfig){super("PurchaseOrder",http,httpUrlGenerator,config);}getWithQuery(params:string | QueryParams):可观察< PurchaseOrder []>{返回super.getWithQuery(params).pipe(点击(res => console.log(res)),map((res:any)=> res.entities));}} 

然后需要注册:

  @NgModule({提供者:[PurchaseOrderDataService]//<-提供数据服务})导出类EntityStoreModule {构造函数(EntityDataService:EntityDataService,PurchaseOrderDataService:PurchaseOrderDataService){entityDataService.registerService(采购订单",PurchaseOrderDataService);//<-注册}} 

并将其与 EntityDataModule.forRoot({entityMetadata}),

一起导入

Using @ngrx/data I want to handle the result of the getWithQuery API call differently than the default.

Currently if this returns an array of entities, this gets loaded in the entityCache directly.

So far I've used the standard pattern shown in the overview:

export const entityMetadata: EntityMetadataMap = {
  PurchaseOrder: {}
};

@Injectable({
  providedIn: "root"
})
export class PurchaseOrderService extends EntityCollectionServiceBase<
  PurchaseOrder
> {
  constructor(serviceElementsFactory: EntityCollectionServiceElementsFactory) {
    super("PurchaseOrder", serviceElementsFactory);
  }
}


Instead I want to handle the following API response and load the entities in the entityCache as the normal getWithQuery would but also stick the total elsewhere in my store.

{
    "entities": [{...}, {...}, ..., {...}],    // list of entities
    "total": 100
}

Naturally I get the following error if this API response is returned:

My understanding is that a default reducer gets created and registered for each entity providing the EntityCollectionDataService interface with the add / delete / getAll / getById / getWithQuery / update methods.

I want to keep these methods but override the getWithQuery reducer to achieve my aim.

This is mentioned in Customizing Entity Reducer Behavior

But quite often you'd like to extend a collection reducer with some additional reducer logic that runs before or after.

How can this be actually done?

I still get the above error if I try to override getWithQuery inside my PurchaseOrderService

  getWithQuery(params) {
    return super.getWithQuery(params).pipe(tap(result => console.log(result)));
  }

解决方案

Managed to get this working using a custom EntityDataService

@Injectable()
export class PurchaseOrderDataService extends DefaultDataService<
  PurchaseOrder
> {
  constructor(
    http: HttpClient,
    httpUrlGenerator: HttpUrlGenerator,
    logger: Logger,
    config: DefaultDataServiceConfig
  ) {
    super("PurchaseOrder", http, httpUrlGenerator, config);
  }

  getWithQuery(params: string | QueryParams): Observable<PurchaseOrder[]> {
    return super.getWithQuery(params).pipe(
      tap(res => console.log(res)),
      map((res: any) => res.entities)
    );
  }
}

Then this needs to be registered:

@NgModule({
  providers: [PurchaseOrderDataService] // <-- provide the data service
})
export class EntityStoreModule {
  constructor(
    entityDataService: EntityDataService,
    purchaseOrderDataService: PurchaseOrderDataService
  ) {
    entityDataService.registerService(
      "PurchaseOrder",
      purchaseOrderDataService
    ); // <-- register it
  }
}

And import this alongside EntityDataModule.forRoot({ entityMetadata }),

这篇关于@ ngrx/data-如何扩展集合精简器/替换对数据服务调用结果的处理?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆