代码之家 › 专栏 › 技术社区 › Raas Masood

如何订阅从ngrx的实体数据服务返回的Observable

angular-ngrx-data ngrx-entity rxjs-observables ngrx angular

Raas Masood · 技术社区 · 5 年前

我有一个名为TransactionEntityService的服务,它是从EntityCollectionServiceBase派生出来的,用于名为Transaction的模型。

export class TransactionEntityService
extends EntityCollectionServiceBase<Transaction> {

我正在使用TransactionDataService来覆盖DefaultDataService的默认行为。在AppModule中,TransactionDataService的注册方式如下

    export class AppModule {
  constructor(
    private eds: EntityDefinitionService,
    private entityDataService: EntityDataService,
    private transactionsDataService: TransactionsDataService
  ) {
    eds.registerMetadataMap(entityMetadata);

    entityDataService.registerService('Transaction', transactionsDataService);
  }
}

TransactionsDataService覆盖了getAll,如下所示。

    export class TransactionsDataService extends DefaultDataService<Transaction> {
  constructor(
    http: HttpClient,
    httpUrlGenerator: HttpUrlGenerator,
    private notifyService: NotificationService
  ) {
    super('Transaction', http, httpUrlGenerator);
  }
  getAll(): Observable<Transaction[]> {
    return this.http
      .get<ApiResponse>('https://localhost:xxxx/transaction/GetLastSixMonth')
      .pipe(
        tap((data) => {
          this.notifyService.showSuccess(data.message, 'Sucess');
        }),
        map((res) => res.result),
        catchError((err) => {
          this.notifyService.showError(
            'Error While Six Month Transactions',
            'Error'
          );
          return of();
        })
      );
  }

实体服务的“$entity”属性在调用api后返回正确的结果。我正在过滤该结果,以获取名为last6Month DepositCount$的可观察对象中的某些内容的计数。

  this.last6MonthDepositCount$ = this.transactionsEntityService.entities$.pipe(
  map((transactions) => {
    const res = transactions.filter(
      (transaction) =>
        transaction.transactionType === TransactionType.Deposit
    ).length;
    return res;
  })//,
 // tap((val) => this.depositCount = val)
);

在html中,我可以使用这个observable

{{ last6MonthDepositCount$  | async }}

它奏效了。

我应该怎么做才能在代码中的另一个变量中使用这个observable的值?

this.last6MonthDepositCount$.subscribe(x => this.dipositCount = x);

这种代码不起作用。我在dipositCount中得到0,它看起来像可观测值的初始值。

0 回复 | 直到 5 年前

abhay tripathi 5 年前

在这里 反应范式 正在与碰撞 势在必行 一个。

myChart.data.datasets[0].data 之前被打过电话 this.last6MonthDepositCount$.subscribe(x => this.dipositCount = x); 给出最终值。

您需要做的是:-在中使用初始/默认值初始化chartJs ngAfterViewInit 并更新 myChartData 在里面 this.last6MonthDepositCount$.subscribe() 方法。

如果你想同时从两个可观测值中获得结果,请使用 组合最新

const timerObservable1 = timer(0, 1000); 
    const timerObservable2 = timer(500, 1000); 
    const combinedTimers = combineLatest(timerObservable1, timerObservable2);
    combinedTimers.subscribe((value1, value2) => //DO something with both values together to update Chart);