javascript / intermediate
Snippet
Vermeidung von Mehrfacheinsendungen mit exhaustMap
Der Operator exhaustMap wird verwendet, um neue Werte eines Quell-Observables zu ignorieren, während ein inneres Observable (wie ein HTTP-Request) noch ausgeführt wird. Dies ist ideal, um 'Doppelklick'-Fehler bei Formularübermittlungen zu vermeiden.
snippet.js
1
2
3
4
5
submitClick$ = new Subject<void>();saveData$ = this.submitClick$.pipe(exhaustMap(() => this.http.post('/api/data', { id: 1 }))).subscribe();
angular
Erklärung
1
exhaustMap(() => ...)
Startet das innere Observable und ignoriert weitere Klicks, bis die Anfrage abgeschlossen ist.
2
this.http.post(...)
Die asynchrone Aufgabe, die beendet sein muss, bevor exhaustMap eine neue Eingabe akzeptiert.