javascript / intermediate
Snippet
Race Conditions verhindern mit switchMap
In Angular-Suchimplementierungen ist switchMap entscheidend. Es bricht das vorherige Observable ab, sobald ein neuer Wert eintrifft. Dies verhindert 'Race Conditions', bei denen eine ältere, langsamere Netzwerkanfrage eine neuere überschreiben könnte.
snippet.js
1
2
3
4
5
this.searchTerms$.pipe(debounceTime(300),distinctUntilChanged(),switchMap(term => this.http.get(`/api/search?q=${term}`))).subscribe(results => this.results = results);
angular
Erklärung
1
debounceTime(300)
Wartet auf 300ms Stille, bevor der letzte Wert emittiert wird.
2
distinctUntilChanged()
Emittiert nur, wenn der aktuelle Wert sich vom letzten unterscheidet.
3
switchMap(...)
Wechselt zu einem neuen inneren Observable und bricht das vorherige ab.