Angular2 Observable.forkJoin наблюдаемых переменных - ReferenceError: Observable не определен

Я хотел бы попросить вас о помощи. Я пропустил код, который, как я предполагаю, не важен. Представьте себе TS файл, содержащий служебные вызовы:

//файл: 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
     }
}

//файл: someComponent.ts

Обратите внимание, что this.method1observable и method2observable должным образом назначены из родительского (корневого) компонента, а их тип - 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);
        });
    }
}

Я получаю "Неоткрытый ReferenceError: Observable не определен" . Разве ты не знаешь, что я делаю неправильно? Я видел несколько примеров, когда Observable.forkJoin вызывается внутри службы. Но что, если я хочу называть его внутри компонента?

Ответ 1

Вы можете попробовать импортировать этот путь:

import {Observable} from 'rxjs/Rx';

вместо:

import {Observable} from 'rxjs/Observable';

Вы также должны использовать массив для обеспечения своих наблюдаемых для метода forkJoin:

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

И не забудьте указать входы в @Component:

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

Ответ 2

Вам следует избегать импорта всей библиотеки rxjs, поскольку она довольно большая. Если у вас есть следующие импорт в любом месте в вашем приложении, вы будете импортировать все rxjs, поэтому имейте это в виду:

import {Observable} from 'rxjs';

или

import {Observable} from 'rxjs/Rx';

Вместо этого вы можете импортировать отдельные функции, которые вы будете использовать, например:

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

ОБНОВЛЕНИЕ: Начиная с rxjs 5.5, рекомендуемый способ импорта операторов::

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))

Ответ 3

вы можете обратиться к этой ссылке за дополнительной информацией об использовании метода forkjoin() для запуска нескольких одновременных запросов http.get(). Здесь вы можете получить полный рабочий пример.

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