angular - trigga observable några millisekunder efter att ha slutat skriva i textfältet

Jag använder Angular4 och RxJS

Grundläggande antagande är att: när användaren anger en enstaka bokstav i textfältet triggar jag någon getData()-funktion (keyup-händelse), hämtar datan och visar den under textfältet

Jag skulle vilja att funktionen inte triggas och att datan inte hämtas direkt efter att användaren skriver en bokstav, utan låta honom skriva en hel fras, vänta till exempel 300 millisekunder och slutligen trigga funktionen, hämta datan och visa den

så flödet jag skulle vilja uppnå är liknande detta:

myService.getDataAsObservable
.whatToDoHere?
.subscribe(data => ...handle and display the data...);

En lösning är att slå in allt i setTimeout(), men det skulle vara mycket bättre att göra det smidigt i en observables-stil

Jag har en gång sett lösningen på det problemet, men kan inte hitta den igen..

tack!

Svar #1

Du kommer att behöva använda debounce-operatorn:

myService.getDataAsObservable
.debounce(300)
.subscribe(data => ...handle and display the data...);

Här är den visuella förklaringen:

var someObservable = getDataAsObservable('---x---x---x---|');
var someDuration = 300;  //                              '--------|';
var expected =            '---------------------------------------x---|';