为什么我得到缓冲区不是函数错误

Question

我是一个具有可观察性的noobie，我试图创建一个可观察的单击流，以忽略双击时发生的2单击事件，但我得到了以下错误：-

Unhandled Promise rejection: this.clickStream.buffer is not a function ; Zone: <root> ; Task: Promise.then ; Value: TypeError: this.clickStream.buffer is not a function

我不明白为什么。

守则如下：

import {Component, NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {Subject} from 'rxjs/Subject';
import {Observable} from 'rxjs/Observable';

@Component({
    selector: 'my-app',
    template: `
         <div>
              <button (click)="clickStream.next(1)">Click me!</button>
         </div>
    `,
})
export class App {
    clickStream: Observable<number> = new Subject<number>();
    singleClick;

    constructor() {
        this.singleClick = this.clickStream.buffer(() => this.clickStream
                                                             .debounce(250))
                               .map(arr => arr.length)
                               .filter(len => len != 2);
        this.singleClick.subscribe(console.log.bind(console));
    }
}

@NgModule({
     imports: [ BrowserModule ],
     declarations: [ App ],
     bootstrap: [ App ]
})
export class AppModule {}

我一直在使用Angular + Typescript Demo Plunk来测试这个。

Answer 1

我想问题是这条线

this.singleClick = this.clickStream.buffer(() => this.clickStream.debounce(250))

bufferWhen操作符使用一个函数，但buffer只使用可观察到的：

this.singleClick = this.clickStream.buffer(this.clickStream.debounce(250))

学习RXJS -缓冲区

我想知道你是否需要缓冲区，借方应该就足够了。

另外，还有debounce (函数)和debounceTime ( ms时间)，所以您也想要更改它。

我已经设置了一个CodePen来玩。