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

Question

我有一个从 EntityCollectionServiceBase 派生的名为 TransactionEntityService 的服务，用于一个名为 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();
        })
      );
  }

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

  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，它看起来像可观察对象的初始值。

Answer 1

此处反应式范式与命令式[=27=]发生冲突。

myChart.data.datasets[0].data 在 this.last6MonthDepositCount$.subscribe(x => this.dipositCount = x); 给出最终值之前被调用。

您需要做的是：- 在 ngAfterViewInit 中使用 initial/default 值初始化 chartJs，并在 this.last6MonthDepositCount$.subscribe() 方法中更新 myChartData。

如果您想同时获得 2 个可观察量的结果，请使用 combineLatest

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

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

how to subscribe to an Observable returned from ngrx's Entity Data Service

ngrx

angular

ngrx-entity

angular-ngrx-data

rxjs-observables