web-dev-qa-db-ja.com

Angular 2でngrxエフェクトのパラメータにアクセスする方法は？

ディスパッチするときに2つのパラメーターを必要とするhttpサービス呼び出しがあります。

_@Injectable()
export class InvoiceService {
  . . .

  getInvoice(invoiceNumber: string, zipCode: string): Observable<Invoice> {
    . . .
  }
}
_

その後、これらの2つのパラメーターをエフェクトのthis.invoiceService.getInvoice()に渡すにはどうすればよいですか？

_@Injectable()
export class InvoiceEffects {
  @Effect()
  getInvoice = this.actions
    .ofType(InvoiceActions.GET_INVOICE)
    .switchMap(() => this.invoiceService.getInvoice())  // need params here
    .map(invoice => {
      return this.invoiceActions.getInvoiceResult(invoice);
    })
}
_
angularngrx
18
Brandon

アクション内でペイロードにアクセスできます。

@Injectable()
export class InvoiceEffects {
  @Effect()
  getInvoice = this.actions
    .ofType(InvoiceActions.GET_INVOICE)
    .switchMap((action) => this.invoiceService.getInvoice(
      action.payload.invoiceNumber,
      action.payload.zipCode
    ))
    .map(invoice => this.invoiceActions.getInvoiceResult(invoice))
}

または、ngrx/effectsのtoPayload関数を使用して、アクションのペイロードをマップできます。

import { Actions, Effect, toPayload } from "@ngrx/effects";

@Injectable()
export class InvoiceEffects {
  @Effect()
  getInvoice = this.actions
    .ofType(InvoiceActions.GET_INVOICE)
    .map(toPayload)
    .switchMap((payload) => this.invoiceService.getInvoice(
      payload.invoiceNumber,
      payload.zipCode
    ))
    .map(invoice => this.invoiceActions.getInvoiceResult(invoice))
}
18
cartant

@ ngrx/effects v5.0では、ユーティリティ関数toPayloadが削除されました。@ ngrx/effects v4.0以降では廃止されています。

詳細については、以下を参照してください： https://github.com/ngrx/platform/commit/b390ef5

現在（v5.0以降）：

actions$.
  .ofType('SOME_ACTION')
  .map((action: SomeActionWithPayload) => action.payload)

例：

@Effect({dispatch: false})
printPayloadEffect$ = this.action$
    .ofType(fromActions.DEMO_ACTION)
    .map((action: fromActions.DemoAction) => action.payload)
    .pipe(
        tap((payload) => console.log(payload))
    );

前：

import { toPayload } from '@ngrx/effects';

actions$.
  ofType('SOME_ACTION').
  map(toPayload);
6
elim