Chaînage observable et prometteur

Question

J'essaie de mettre à jour l'image de profil de l'utilisateur avec AngularFire. J'utilise la méthode put qui renvoie un promise. Dans mon promise j'utilise un observable pour changer l'image URL dans l'information de l'utilisateur. À la fin je change l'image URL de l'élément DOM de l'image à l'image URL dans l'information de l'utilisateur. Le problème est que mon promise essaie d'obtenir l'image de l'utilisateur URL avant que mon observable ne soit mis à jour. Y at-il un moyen de chaîner un observable à promise afin que promise continue seulement si observable est terminée? Voici mon code:

authService.ts

updatePicture(profilePicture){ 
    //first put the pictuer in the storage 
    return storageRef.put(profilePicture) 
      .then(snapshot => { 
       downloadURL = snapshot.downloadURL; 
      }) 
       //this is where I use the observable to update user info 
      .then(() => { 
       this.getUserAuth().subscribe(userAuth => { 
        userAuth.updateProfile({ 
         displayName:userAuth.displayName, 
         photoURL:downloadURL 
        }) 
       }) 
      }) 
} 

user.component.ts

// I want this "then" to only happen when my observable is complete. 
authService.updatePicture().then(p => { 
    document.querySelector('img').src = this.userAuth.photoURL); 
} 

Answer 1

Essayez d'envelopper l'observable dans un new promise, et l'utiliser dans votre chaîne de promesses comme celle-ci:

var obs = new Observable(...); 
var promise = new Promise((resolve, reject) => { 
    obs.subscribe(your_on_next, reject, resolve); 
}); 

Cela devrait vous donner une promesse qui sera résolue lorsque l'observateur se termine. Maintenant, vous pouvez utiliser cette promesse dans la chaîne des promesses au moment où vous en avez besoin. Il suffit de le retourner d'un autre then() dans cette chaîne.

Vous aurez besoin d'ajouter du code supplémentaire pour obtenir tout ce qui est observable en aval de la chaîne.