2017-08-19 1 views
1

J'essaye d'exécuter la requête multiple de XHR (à l'intérieur de la fonction getImages), chacun emballé dans un observable (à l'intérieur de la fonction getImage), en utilisant forkJoin. Cependant, aucune des demandes n'est exécutée, c'est-à-dire que observer.next() n'est jamais exécutée. J'ai essayé d'utiliser zip au lieu de forkJoin mais cela ne fonctionne pas non plus. Je m'assure que je peux complete sur tous les observables que je crée.observable forkjoin n'exécute jamais l'angulaire observable2

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

Répondre

1

Pas assez familier avec XMLHttpRequest, mais de votre diagnostic et les échantillons que j'ai vu de son utilisation, je suppose que vous n'êtes pas atteint readyState de 4 (DONE) parce que vous ne l'avez pas appelé xhr.send ().

De l'exemple donné @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(); 

Je suppose que vous pouvez modifier votre code:

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(); 
})) 
+0

merci monsieur! Je n'ai pas beaucoup utilisé xhr. – quantdaddy