Angular 6 throttleTime doesnt exist in Rx Js

3
votes

I am using angular/cli": "~6.1.5 and rxjs": "^6.0.0 As i new to Angular 6 i started learning from official document

http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html

code is below

var clicks = Rx.Observable.fromEvent(document, 'click');
var result = clicks.throttleTime(1000);
result.subscribe(x => console.log(x));

Same above code i tried in angular 6 

fromEvent(mybuttonId, 'click')
      .subscribe((event) => console.log('clicked'));

But if i add .throttleTime(1000) to from event then it will throw error

Property 'throttleTime' does not exist on type 'Observable

'`.

if i try to add Observable.fromEvent then that method doesn't exist

I have imported Rx js as 

import {Observable, fromEvent, from, of} from 'rxjs';
import {throttleTime} from 'rxjs/operators';

Can any one help me where i can find exact document for latest version.

Thanks

2
javascriptangularrxjsangular6

2 Answers

8
votes

It can be piped on to an Observable like this:

import { fromEvent } from 'rxjs';
import { throttleTime } from 'rxjs/operators';

subscription = fromEvent(document, 'click')
               .pipe(throttleTime(1000))
               .subscribe(x => console.log(x));

You can find it in the Official Docs here:

fromEvent | throttleTime

Also make sure to unsubscribe from the subscription to avoid any memory leaks. Generally, this is done in ngOnDestroy

0
votes

Thanks to Siddharth Ajmera for the clue for using pipe. In latest Version of rx js we can do as below

 fromEvent(this.hoverSection, 'click')
      .pipe(throttleTime(1000))
      .subscribe((event) => console.log('clicked'));