examples - ng-content select angular 4

despacha múltiples acciones en un efecto

Question

Me gustaría diapatch dos acciones en un solo efecto. Actualmente tengo que declarar dos efectos para lograr esto:

 // first effect
@Effect() action1$ = this.actions$
.ofType(CoreActionTypes.MY_ACTION)
.map(res => {
return { type: "ACTION_ONE"}
})
.catch(() => Observable.of({
type: CoreActionTypes.MY_ACTION_FAILED
}));
// second effect
@Effect() action2$ = this.actions$
.ofType(CoreActionTypes.MY_ACTION)
.map(res => {
return { type: "ACTION_TWO"}
})
.catch(() => Observable.of({
type: CoreActionTypes.MY_ACTION_FAILED
}));

¿Es posible tener una acción, ser la fuente de dos acciones a través de un solo efecto?

Answer 1

Puede elegir mergeMap for async o concatMap for sync

 @Effect() action$ = this.actions$
.ofType(CoreActionTypes.MY_ACTION)
.mergeMap(() => Observable.from([{type: "ACTION_ONE"} , {type: "ACTION_TWO"}]))
.catch(() => Observable.of({
type: CoreActionTypes.MY_ACTION_FAILED
}));

Answer 2

Puedes usar switchMap y Observable.of .

 @Effect({ dispatch: true }) action$ = this.actions$
.ofType(CoreActionTypes.MY_ACTION)
.switchMap(() => Observable.of(
// subscribers will be notified
{type: ''ACTION_ONE''} ,
// subscribers will be notified (again ...)
{type: ''ACTION_TWO''}
))
.catch(() => Observable.of({
type: CoreActionTypes.MY_ACTION_FAILED
}));

El rendimiento importa:

En lugar de enviar muchas acciones que activarán a todos los suscriptores tantas veces como usted envíe , es posible que desee echar un vistazo a redux-batched-actions .

Esto le permite advertir a sus suscriptores solo cuando todas esas múltiples acciones se han aplicado a la tienda.

Por ejemplo :

@Effect({ dispatch: true }) action$ = this.actions$
.ofType(CoreActionTypes.MY_ACTION)
// subscribers will be notified only once, no matter how many actions you have
// not between every action
.map(() => batchActions([
doThing(),
doOther()
]))
.catch(() => Observable.of({
type: CoreActionTypes.MY_ACTION_FAILED
}));

Answer 3

también puedes usar .do () y store.next ()

do le permite adjuntar una devolución de llamada al observable sin afectar a los otros operadores / cambiar el observable

p.ej

@Effect() action1$ = this.actions$
.ofType(CoreActionTypes.MY_ACTION)
.do(myaction => this.store.next( {type: ''ACTION_ONE''} ))
.switchMap((myaction) => Observable.of(
{type: ''ACTION_TWO''}
))
.catch(() => Observable.of({
type: CoreActionTypes.MY_ACTION_FAILED
}));

(necesitarás una referencia a la tienda en tu clase de efectos)

Answer 4

@Effect()
loadInitConfig$ = this.actions$
.ofType(layout.ActionTypes.LOAD_INIT_CONFIGURATION)
.map<Action, void>(toPayload)
.switchMap(() =>
this.settingsService
.loadInitConfiguration()
.mergeMap((data: any) => [
new layout.LoadInitConfigurationCompleteAction(data.settings),
new meetup.LoadInitGeolocationCompleteAction(data.geolocation)
])
.catch(error =>
Observable.of(
new layout.LoadInitConfigurationFailAction({
error
})
)
)
);