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

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

问题描述:

我是一个noobie with observables,我试图创建一个可观察的点击流来忽略双击时发生的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对此进行测试。

+0

import'rxjs/add/operator/buffer'; ? – Maxime

+0

通过导入所有操作符来消除错误,但是当按下按钮时没有任何反应。我有'codepen.io'中的类似的代码工作正常,我试图得到这个'angular/typescript'代码的工作。 – user223364

我认为这个问题是此行

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

bufferWhen操作员使用的功能,但buffer只使用可观察:

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

LEARN RXJS - buffer

我想知道,如果你即使需要缓冲区,防抖也应该足够。

另外,有debounce它需要一个功能和debounceTime需要毫秒时间 - 所以你也想改变这一点。

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

+0

当我使用'this.singleClick = this.clickStream.buffer(this.clickStream.debounce(250))'我得到'ERROR TypeError:this.durationSelector.call不是一个函数。 – user223364

+0

该消息将来自反跳错误。 –

+0

我切换到使用'debounceTime',它的工作。 – user223364