Http get call返回太多结果。 ::的JavaScript

Question

我有一个功能：

private getValues() {
  this._values = [];
  this._watchlistElements.map(v =>
    this.http.get('http://localhost/getValue/' + v.xid)
      .subscribe(res => {
        this._values.push(res.json());
       console.log(this._values.length);
  }))
};

调用该函数后，我得到的结果如下：

我的问题是如何检查_values变量的实际长度？这个解决方案有效，但正如您所看到的，它会在每次迭代时返回一个结果，就像在循环中一样。如何让它只返回一个最终结果？在这种情况下，-->长度应为 7 。

Answer 1

在Promise中捕获每个调用，然后等待所有调用是一个很好的方法：

Promise.all(this._watchlistElements
  .map(v => new Promise(resolve => this.http.get(...).subscribe(res => resolve(res.json())))))
    .then(arrayWithResultFromEachCall => console.log(arrayWithResultFromEachCall.length))

Answer 2

有同样的问题。刚刚使用了rxjs中的observables。

首先将observable导入您的组件：

import {Observable} from 'rxjs/Observable';

然后，固定功能：

private getValues() {
  this._values = [];
  Observable.forkJoin(
    this._watchlistElements.map(v => {                                                          
    return this.http.get('http://localhost/getValue/' + v.xid)
      .map(res => res.json());
  })
  ).subscribe(v => {
    this._values = v;
    console.log(this._values.length);
  });
};

结果=＆gt;的 7