Question

我想请你帮忙。我省略了我认为不重要的代码。让我们假设包含服务调用的TS文件：

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

请注意，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的例子。但是如果我想在组件中调用它呢？

Answer 1

您可以尝试以这种方式导入：

import {Observable} from 'rxjs/Rx';

而不是：

import {Observable} from 'rxjs/Observable';

您还应该使用数组为forkJoin方法提供您的observable：

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

不要忘记在@Component中指定输入：

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

Answer 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开始，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

您可以参考此链接以获取有关使用forkjoin（）方法运行多个并发http.get（）请求的更多信息。您可以获得完整的工作示例。

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

可观察变量的Angular2 Observable.forkJoin - ReferenceError：未定义Observable

3 个答案: