Angular2 Observable.forkJoin of observable variables - ReferenceError: Observable is not defined

Question

I\'d like to ask you for help. I omitted code that I assume is not important. Let\'s imagine TS file that contains service calls:

// file: someService.ts

<         


        

Answer 1

You could try to import this way:

import {Observable} from 'rxjs/Rx';

instead of:

import {Observable} from 'rxjs/Observable';

You should also use an array to provide your observables to the forkJoin method:

ngOnInit() {
        Observable.forkJoin([this.m1,this.m2])
        .subscribe(data => {
            this.myFunction(data[0], data[1]);
            requestAnimationFrame(this.renderLoop);
        });
    }

And do not forget to specify inputs in @Component:

@Component({
    inputs: ['m1', 'm2']
})

Answer 2

You should avoid importing the whole rxjs library as it is quite big. If you have the following imports anywhere in your app, you will be importing the whole rxjs, so have that in mind:

import {Observable} from 'rxjs';

or

import {Observable} from 'rxjs/Rx';

You can instead import the individual features that you will be using, for example:

import {Observable} from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/observable/forkJoin';

UPDATE: Starting with rxjs 5.5, the recommended way to import operators is:

import { range } from 'rxjs/observable/range';
import { map, filter, scan } from 'rxjs/operators';

const source$ = range(0, 10);

source$.pipe(
  filter(x => x % 2 === 0),
  map(x => x + x),
  scan((acc, x) => acc + x, 0)
)
.subscribe(x => console.log(x))

Answer 3

you can refer to this link for more information about using forkjoin() method to run multiple concurrent http.get() requests.Here u can get a complete working example.

http://www.metaltoad.com/blog/angular-2-http-observables