2017-08-05 1 views
0

Ich versuche, Profilbild des Benutzers mit AngularFire zu aktualisieren. Ich benutze die put Methode, die eine promise zurückgibt. Innerhalb meiner promise benutze ich eine observable, um das Bild URL in Benutzerinformationen zu ändern. Am Ende ändere ich das Bild URL des Bildes DOM Element auf das Bild URL in Benutzerinformationen. Das Problem ist, dass mein promise versucht, das Bild des Benutzers URL zu erhalten, bevor meine observable Aktualisierung getan wird. Gibt es eine Möglichkeit, eine observable zu promise zu verketten, so dass promise nur fortgesetzt wird, wenn observable abgeschlossen ist? Hier ist mein Code:Verkettung beobachtbar und Versprechen

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

Antwort

0

Versuchen Sie, die beobachtbare in eine new promise Einwickeln, und verwenden, die in der Kette von Versprechen wie folgt:

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

Dies sollte Ihnen ein Versprechen geben, das aufgelöst wird, wenn der Beobachter beendet wird. Jetzt können Sie dieses Versprechen in der Kette der Versprechen an dem von Ihnen gewünschten Punkt verwenden. Einfach von einem anderen then() in dieser Kette zurückgeben.

Sie müssen zusätzlichen Code hinzufügen, um etwas aus dieser Observablen zu erhalten, die Sie in der Kette stromabwärts benötigen.

Verwandte Themen