Tomino Tomino - 3 months ago 162
TypeScript Question

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

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

@Injectable()
export class SomeService {
method1(){
var observable = this.http.get(someUrl)
.map((res: Response) =><MyClass[]>res.json());
return observable;
}

method2(){
// Similar to method1
}
}


// file: someComponent.ts

Please note, that this.method1observable and method2observable are properly assigned from parent (root) component and their type is Observable.

import {Observable} from 'rxjs/Observable';

export class SomeClass {
public m1: Observable<MyClass[]>;
public m2: Observable<AnotherClass[]>

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


I get "Uncaught ReferenceError: Observable is not defined".
Don't you know what am I doing wrong? I saw some examples where Observable.forkJoin is called inside a service. But what if I want to call it inside a component?

Answer

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']
})
Comments