RxJS - 如何手动发送缓冲区/查看缓冲区中的元素

问题描述：

我想要做的是获取键盘事件的数量，如果这些事件之间的时间少于提供的。也许这不是正确的做法，这就是为什么我仍然在同一个地方。RxJS - 如何手动发送缓冲区/查看缓冲区中的元素

所以我首先用过滤器做了简单的流，以捕捉每一个我感兴趣的事件。接下来，我做了第二个流，并将事件分组为可以测量时间戳的对。它似乎工作得很好，但只有偶数的事件 - 所以在这段时间后，我需要检查是否有东西在缓冲区中，如果它在那里，我应该把它添加到我的字符串。

代码：

const timeToWait : number = 500; 
const keyDigitsUp$ = Observable.fromEvent(document, "keyup") 
    .filter((event:any) => {return ((event.keyCode>=48 && event.keyCode <=57) || 
(event.keyCode>=96 && event.keyCode <=106))}); 

let bufferedEvents = Observable.from(keyDigitsUp$).bufferCount(2); 
let numbers : string = ""; 

bufferedEvents.subscribe((eventArray) => { 
    if (eventArray[1].timeStamp - eventArray[0].timeStamp <= timeToWait) 
    { 
     numbers+=eventArray[0].key + eventArray[1].key; 
    } 
    else 
    { 
     numbers=""; 
    } 
});

有什么办法，使这一概念的作品？或者也许有更好的方法，我失踪了。我也做了其他的概念，但他们产生了类似的结果。我当然可以让它以非反应性的方式工作，并订阅主流 - 如果存在，则保存上一个事件，并与下一个等等进行比较，但是由于我试图学习反应式编程，因此我希望将其作为尽可能多的反应。

澄清：您是否想先构建帧，然后测试该时间帧内捕获的事件，或者是否希望始终将两个事件组合在一起，并测试两个事件的时间间隔是否超过'timeToWait '？如果你想测试固定的时间框架看看这个：https://jsfiddle.net/bbnprgmr/ – dotcs

Thx回应卢卡。我的目标是捕获它们之间的timeStamp小于指定的事件。它应该像这样工作 - 我按键盘上的数字，我有500毫秒推另一个 - 否则我会发出字符串与数字和清除现有的。每次当我推入另一个数字（500毫秒）时，我应该将该缓冲时间重置另一段时间（在这种情况下为500毫秒）。所以它是时间和组缓冲的混合 – 5k7

答

你工作太辛苦:-)

const timeout = 500; 

keyDigitsUp$ 
    .buffer(keyDigitsUp$.debounce(timeout)) 
    .map(events => (events.length <= 1 ? '' : events.map(event => event.key).join(','))) 
    .subscribe(v => console.log('events for timeout ' + timeout + ' msec: '+ v));

看到一个working jsbin。

这样做的方式是，只有当你的任何按键没有按超时（本例中为500）mSecs时，它才会关闭缓冲区（即产生一个块）。

我不确定你想用关键代码做什么，所以我只是用逗号分隔符连接它们。

请注意，rxjs 5语法可能略有不同。

RxJS - 如何手动发送缓冲区/查看缓冲区中的元素

相关推荐