CODEWITHSUNDEEP
angulartypescriptrxjsangular6reactive
Hucho
Hucho

Reputation: 101

Angular 6: use Rx.Observable - what to import?

I would like to implement such kind of code:

    var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: { lat: -25.363, lng: 131.044 }
});

var source = Rx.Observable.fromEventPattern(
    function (handler) {
        return map.addListener('center_changed', handler);
    },
    function (handler, listener) {
        google.maps.event.removeListener(listener);
    }
);
source.subscribe(function () {
    console.log(map.getCenter());
});

I tried many ways, but I am struggling to set the import configuration in a way so I get no error regarding "Rx.Observable.fromEventPattern".

Can anyone please how to set it up in a right way. I am using "rxjs": "~6.2.0" and Angular 6.

Thanks a lot

Hucho

Upvotes: 0

Views: 423

Answers (2)

Hucho
Hucho

Reputation: 101

Thanks for your help. Finally this worked:

public $getBounds(): Observable<any> {
    let map = this.map;
    return fromEventPattern(
      function (handler) {
        google.maps.event.addListener(map, 'idle', handler);
      },
      function (handler, listener) {
        google.maps.event.removeListener(listener);
      }
    )
  }

I needed to have a caller signature...

Hucho

Upvotes: 0

Niladri
Niladri

Reputation: 5962

As you are using Rxjs 6 , you should import it like below -

import { fromEventPattern} from 'rxjs';

as per the documentation all Observable creation methods should be imported like above in rxjs 6 .

So your code should be like below - 

var source = fromEventPattern(
 function (handler) {
        return map.addListener('center_changed', handler);
    },
    function (handler, listener) {
        google.maps.event.removeListener(listener);
    }
  );

you can also import Observable like above.

Refer to this migration documentation : https://github.com/ReactiveX/rxjs/blob/master/docs_app/content/guide/v6/migration.md

Upvotes: 2

Related Questions