Angular 4 Observables mouse coordinates

Question

I want to know how it's possible to get mouse coordinates X and Y using only Observables without http service using Angular 4.

Answer 1

Http module is not a dependency for RxJS observables, so you don't have to use it. In fact, Http module itself uses RxJS to empower Http operands with reactive capabilities.

In order to subscribe to events like mousemove, you would simply import fromEvent and Observable and subscribe to its event emitter. Something like this should work:

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/fromEvent';

Observable.fromEvent(document.body, 'mousemove').subscribe(e => {
  console.log(e.pageX, e.pageY)
})

Of course, use the appropriate event source (instead of document.body).