angular - Aynı anda birden fazla ngrx eylemi nasıl dispatch edilir

Ben ngrx kullanıyorum ve aynı anda 2 aksiyon göndermem gereken bir senaryom var. Durumum güncelleniyor ve güncellendi gibi özelliklere sahip ve aşağıdaki gibi görünüyor.

//from reducer
const defaultCardState: CardState = {
    ids: [],
    entities: {},
    loaded: false,
    loading: false,
    adding: false,
    added: false,
    updating: false,
    updated: false,
    deleting: false,
    deleted: false
};

Bunlar, bileşenimden gönderdiğim eylemler

this.store.dispatch(fromCard.updateCard({id: id1, changes: {name: name1}}))
this.store.dispatch(fromCard.updateCard({id: id2, changes: {name: name2}}))

Aşağıda benim action, reducer ve effect'im var

//Update Card Actions
export const updateCard = createAction('[Cards] Update Card', props<{id: string, changes: any}>())
export const updateCardSuccess = createAction('[Cards] Update Card Success', props<{changes: any}>());
export const updateCardFail = createAction('[Cards] Update Card Fail')

//Reducer
on(fromCards.updateCard, (state) => ({...state, updating: true, updated: false})),
    on(fromCards.updateCardSuccess, (state, action: any) => ({...cardAdapter.updateOne(action.changes, state), updated: true, updating: false})),
    on(fromCards.updateCardFail, (state, action: any) => fromCards.updateCardFail),

//Update Card Effect
updateCard$: Observable<Action> = createEffect(() => this.actions$.pipe(
    ofType(fromCardActions.updateCard),
    map((action: any) => { return {id: action.id, changes: action.changes}}),
    switchMap((action: any) => this.cardService.updateCard(action).pipe(
        map((res) => (fromCardActions.updateCardSuccess({changes: action }))),
        catchError(() => of(fromCardActions.updateCardFail))
    ))
))

Bu eylemleri art arda göndermenin en iyi yolu nedir, böylece güncellenen ve güncellenmiş alanlar çakışmaz? Sadece birini çalıştırırsam işe yarıyor ama yukarıda gösterildiği gibi ikisini birden gönderirsem sadece biri tamamlanıyor. Her iki eylemin de gönderildiğini görüyorum ama sadece bir başarı eylemi gönderiliyor.

Cevap #1

Tony'nin cevabına benzer, ancak doğru operatörü kullanarak:

@Effect()
dispatchMultiAction$: Observable<Action> = this.actions$.pipe(
    ofType<SomeAction.Dispatch>(someActions.Dispatch),
    mergeMap(_ => [
            new someActions.InitData(),
            new someActions.GetData(),
            new someActions.LoadData()
        ])
    )
);

Cevap #2

Efektinizde birden fazla eylem gönderebilirsiniz ve bunu sadece efektten yapmanızı tavsiye ederim

Aşağıdaki örneği dikkate alın

@Effect()
dispatchMultiAction$: Observable<Action> = this.actions$.pipe(
    ofType<SomeAction.Dispatch>(someActions.Dispatch),
    switchMap(_ =>
        of(
            new someActions.InitData(),
            new someActions.GetData(),
            new someActions.LoadData()
        )
    )
);

İlgili makaleler