observable forkjoin永远不会执行可观察的angular2

Question

我试图使用forkJoin执行多个XHR请求（在getImages函数中），每个请求都包含在可观察对象（在getImage函数内）中。然而，没有任何请求被执行，即从不执行observer.next()。我曾尝试使用zip而不是forkJoin，但这也不起作用。我确信我可以在我创建的所有观察对象上都有complete。

getImages(urls: string[]) { 
    Observable.forkJoin(...urls.map(url => {return this.getImage(url)})) 
      .subscribe(
       (result) => {console.log(result)}, 
       (err) => {console.log(err)}, 
       () => {}); 
} 

private getImage(url: string): Observable<string> { 
    let xhr = new XMLHttpRequest(); 
    return Observable.create((observer => { 
     xhr.onreadystatechange =() => { 
      if (xhr.readyState === 4) { 
       if (xhr.status === 200) { 
        observer.next(xhr.response); 
       } else { 
        observer.error(xhr.response); 
       } 
       observer.complete(); 
      } 
     } 
     xhr.responseType = "blob"; 
     xhr.open("GET", url, true); 
    })) 
} 

Answer 1

不使用XMLHttpRequest不够熟悉，但是从你的诊断，我已经看到了它的使用的样品，我想，你没有达到的readyState的4（DONE），因为你已经不叫xhr.send（ ）。

从示例中列出@https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/onreadystatechange

var xhr = new XMLHttpRequest(), 
    method = "GET", 
    url = "https://developer.mozilla.org/"; 

xhr.open(method, url, true); 
xhr.onreadystatechange = function() { 
    if(xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) { 
    console.log(xhr.responseText); 
    } 
}; 
xhr.send(); 

所以我想你可能要修改你的代码：

return Observable.create((observer => { 
    xhr.onreadystatechange =() => { 
     if (xhr.readyState === 4) { 
      if (xhr.status === 200) { 
       observer.next(xhr.response); 
      } else { 
       observer.error(xhr.response); 
      } 
      observer.complete(); 
     } 
    } 
    xhr.responseType = "blob"; 
    xhr.open("GET", url, true); 
    xhr.send(); 
}))