在完成输入文本字段后触发可观察的几毫秒

Question

我使用 angular4 和 RxJS

基本假设是：当用户在文本字段中输入单个字母时，我会触发一些 getData() 函数（keyup 事件），获取数据并显示在文本字段下方

我不想在用户输入字母后立即触发该功能并获取数据，而是让他输入完整的短语，等待例如300毫秒最后触发该功能，获取数据并显示

所以我想实现的流程类似于：

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

一种解决方案是将其全部封装到 setTimeout() 中，但最好以可观察的方式流畅地执行此操作

我曾经看过该问题的解决方案，但无法再次找到它..

谢谢！

Answer 1

您需要使用debounce 运算符：

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

这是视觉解释：

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