javascript - Cum pot anula o cerere API în efectul meu ngrx

Așadar, pe o pagină dată pot să trimit mai multe acțiuni pentru a rula o cerere de căutare toate pe același endpoint API. În efectele mele am un efect pentru a face această cerere care arată cam așa:

    runSearchSuccess$ = createEffect(() =>
    this.actions$.pipe(
            ofType(MyActions.runSearch),
            mergeMap(({searchRequest}) => this.myService.runSearch(searchRequest).pipe(
                map((response) => {
                    return MyActions.runSearchSuccess({ searchResponse: response })
                }),
                catchError(error => {
                    const searchResponse = null;
                    return [
                        MyActions.updateSearchStatuses({searchResponse}),
                    ]
                }),
            )),
        )
    );

Aceste cereri pot dura mult timp, așa că dacă inputul utilizatorului pe pagină se schimbă, unele cereri care sunt în desfășurare pot deveni inutile și trebuie anulate. Datele referitoare la ce cereri de căutare sunt relevante se află în magazin, așa că am un selector pentru a le obține pe toate. Ceea ce vreau să fac este să urmăresc modificările acestui selector și dacă, la un moment dat, cererea de căutare nu mai este relevantă, vreau să o anulez. Nu cred că pot folosi TakeUntil pentru că depinde doar de ce vine din selector. Am încercat să folosesc TakeWhile, dar nu am găsit o modalitate de a anula efectiv apelul API și nu doar efectul. Există o modalitate de a realiza acest lucru cu TakeWhile sau există o modalitate mai bună de a gestiona apelurile mele de rețea active și a le anula atunci când este necesar?

Răspuns #1

Va trebui să înlocuiești mergeMap cu switchMap. Diferența este că mergeMap rulează toate cererile în paralel, în timp ce switchMap va anula cererile în așteptare când apare o cerere nouă.

Documente :

• https://rxjs.dev/api/operators/mergeMap
• https://rxjs.dev/api/operators/switchMap