Всякий раз, когда я могу попытаться создать HTTP
запросов сразу, вместо того, чтобы вставлять несколько вызовов один за другим, при этом я использую forkJoin
.
Однако вместо того, чтобы делать только два запроса, он выполните следующее:
- Сделайте два запрошенных запроса
- Сделайте бесконечный l oop последнего запроса
Что происходит включено?
НАЗАД:
updatePartial(people: Update<IPeople>): Observable<Update<IPeople>> {
return this.httpClient.patch<Update<IPeople>>(`${this.endpoint}/${people.id}`, people);
}
ЭФФЕКТ:
updateManyPartial$: Observable<Action> = createEffect(() =>
this.action$.pipe(
ofType(fromPeopleActions.UPDATE_MANY_PARTIAL),
mergeMap((action) => {
const https: Observable<Update<IPeople>>[] = [];
action.updates.forEach((people) => https.push(this.backend.updatePartial(people)));
return forkJoin(https).pipe(
delay(1000),
map(() => fromPeopleActions.UPDATE_MANY_PARTIAL_SUCCESS({ updates: action.updates })),
catchError((error) => of(fromPeopleActions.UPDATE_MANY_PARTIAL_FAIL({ error: this.requestHandler.getError(error) })))
);
})
)
);
РЕДУКТОР:
const peopleReducer = createReducer(
INIT_STATE,
on(fromPeopleAction.GET_ALL_SUCCESS, fromPeopleAction.CREATE_ALL_SUCCESS, (state, { peoples }) => adapter.addMany(peoples, { ...state, loading: false })),
on(fromPeopleAction.UPDATE_MANY_PARTIAL_SUCCESS, (state, { updates }) => adapter.updateMany(updates, { ...state, loading: false })),
on(fromPeopleAction.GET_ALL_FAIL, fromPeopleAction.CREATE_ALL_FAIL, fromPeopleAction.UPDATE_MANY_PARTIAL_FAIL, (state, { error }) => ({
...state,
error,
loading: false,
}))
);
ДЕЙСТВИЯ:
export const UPDATE_MANY_PARTIAL = createAction('[PATCH] Partially update many people', props<{ updates: Update<IPeople>[] }>());
export const UPDATE_MANY_PARTIAL_SUCCESS = createAction('[PATCH] Partially update many people with success', props<{ updates: Update<IPeople>[] }>());
export const UPDATE_MANY_PARTIAL_FAIL = createAction('[PATCH] Partially update many people failed', props<{ error: IRequestError }>());
КОМПОНЕНТ:
openTalkContainer(friend: IPeople): void {
this.selectorsService.userFriendClicked.subscribe((people) => {
this.dispatchService.updateManyPartial([
{
id: people.id,
changes: {
isClicked: false,
},
},
{
id: friend.id,
changes: {
isClicked: true,
},
},
]);
});
}