Tengo un método para enviar la acción para consultar la cuenta y seleccionar la cuenta. No estoy seguro de si esta es la mejor práctica para seleccionar los datos después del envío.
this._store.dispatch(AccountsPageActions.loadAccountWithDetails({ accountId: this._accountId })); this.account$ = this._actionsSubject.pipe( filter(action => action.type === AccountsApiActions.loadAccountWithDetailsSuccess.type), switchMap(() => this._store.select(getAccountDetailById(this._accountId)).pipe( tap(account => { this.account = account; this.accountId = this._accountId; this._reportsService.setAccount(account); }) )) );¿Alguien puede decirme una mejor práctica para hacer esto o es este el camino a seguir?
No necesita escuchar el despacho de la acción. Si está diseñado correctamente, su acción actualizará el estado y el selector se actualizará. Esto es suficiente
ngOnInit() { this._store.dispatch(AccountsPageActions.loadAccountWithDetails({ accountId: this._accountId })); // If you want to use the account$ with async pipe account$ = this._store.select(getAccountDetailById(this._accountId)).pipe( filter(account => !!filter), // ignore if no account is returned tap(account => { this.account = account; this.accountId = this._accountId; this._reportsService.setAccount(account); }) ); // or .subscribe(); }Evitaría escuchar los despachos de acción en los componentes, usaría efectos para eso.
No sé por qué necesita el asunto de la acción, puede suscribirse a las acciones usando el código a continuación y siempre que haya un envío de esa acción, se activará. mantenga la suscripción de acción en su constructor y luego puede enviar su acción a todas partes en su componente
PLUCK se utiliza para tomar el valor de accountId de la carga útil
import { Actions, ofType } from '@ngrx/effects'; import { map, pluck, switchMap, tap } from 'rxjs/operators'; ... constructor(private action: Actions) { const sub = this.action.pipe( ofType(AccountsApiActions.loadAccountWithDetailsSuccess.type), pluck('accountId'), switchMap((accountId) => this._store.select(getAccountDetailById(accountId)).pipe( tap(account => { this.account = account; this.accountId = this._accountId; this._reportsService.setAccount(account); }))).subscribe(); } ngOnInit() { this._store.dispatch(AccountsPageActions.loadAccountWithDetails({ accountId: this._accountId })); }