2017-10-28 14 views
0

私はobservablesのnoobieです。私はダブルクリックすると発生する2クリックイベントを無視するためにobservable clickstreamを作成しようとしていますが、このエラーが発生しています: -なぜバッファーが関数エラーではないのですか

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

と私は理由を理解していません。次のように

コードは次のとおりです。 - 私はこれをテストするためにAngular + Typescript Demo Plunkを使用してきた

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 {} 

+0

インポート 'rxjs/add/operator/buffer'; ? – Maxime

+0

これは、すべての演算子をインポートすることでエラーを取り除きましたが、ボタンを押すと何も起こりません。同様のコードが 'codepen.io'で正常に動作していました。これを' angular/typescript'コードとして動作させようとしています。 – user223364

答えて

1

私は問題はbufferWhenオペレーターが機能を使用しますが、bufferだけで、観察を使用しています。このライン

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

だと思う:

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

LEARN RXJS - buffer

ます場合、私は思ったんだけどバッファーを必要としても、デバウンスで十分です。

また、debounceには機能があり、debounceTimeにはmsの時間がかかるため、変更する必要があります。

私は遊ぶためにCodePenを設定しました。

+0

'this.singleClick = this.clickStream.buffer(this.clickStream.debounce(250))を使用すると、'エラーTypeError:this.durationSelector.callが関数ではありません.'というメッセージが表示されます。 – user223364

+0

そのメッセージはデバウンスエラーから来ています。 –

+0

私は 'debounceTime'を使って切り替えました。 – user223364

関連する問題