web-dev-qa-db-fra.com

Comment renvoyer Observable après la résolution d'une promesse dans Ionic 2 / Angular 2?

J'essaie de retourner un observable après avoir réussi ma promesse, mais cette fonction ne retourne pas Observable. Pour être spécifique au code, je veux récupérer le jeton d'authentification dans le stockage (renvoie la promesse) et après que les données ont été récupérées, puis générer une demande de publication à Api (retourne Observable). Ce faisant, le texte sublime donne une erreur sur la fonction selon laquelle "une fonction dont le type déclaré n'est ni 'void' ni 'any' doit retourner une valeur" ci-dessous est mon code,

logout() : Observable<any>{
  this.userData.getAuthToken().then((token)=>{
    this.token = token;
    this.headers = new Headers ({
      "X-USER-TOKEN": token
    });
    this.options = new RequestOptions ({
      headers: this.headers
    });
    var logout_url = "Api logout method";
    return this.http.post(logout_url,{},this.options)
      .map (res => res.json())
  });
}

si je fais simplement une demande de poste, il retourne bien comme ça

return this.http.post(logout_url,{},this.options)
  .map (res => res.json())

mais lorsque j'essaie de récupérer des données, il ne renvoie pas de valeur à partir de cette demande de publication. Toute aide sera très appréciée! Merci d'avance

16
M. Habib

Utilisez fromPromise pour convertir la promesse en observable et utilisez mergeMap pour émettre la réponse HTTP dans l'observable composé:

import { Observable } from 'rxjs/Observable/';
import 'rxjs/add/observable/fromPromise';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/mergeMap';

logout(): Observable<any>{
  return Observable.fromPromise(this.userData.getAuthToken()).mergeMap(token => {
    this.token = token;
    this.headers = new Headers({
      "X-USER-TOKEN": token
    });
    this.options = new RequestOptions({
      headers: this.headers
    });
    var logout_url = "Api logout method";
    return this.http.post(logout_url, {}, this.options).map(res => res.json());
  });
}
40
cartant

Vous retourneriez un Promise (si vous n'aviez pas manqué la partie return en face de lui) qui retournerait un Observable en cas de succès. Pensez à utiliser Observables uniquement, plutôt que de les mélanger tous les deux.

Vous pouvez également l'encapsuler dans un nouveau Observable: new Observable(observer =>
https://angular-2-training-book.rangle.io/handout/observables/using_observables.html

2
zurfyx

Avec RXJS> 6, fromPromise est fusionné dans la fonction from et pour utiliser mergeMap, vous devez d'abord utiliser pipe. Donc, ce code fonctionnera

import { Observable, from } from "rxjs";
import { map, mergeMap } from "rxjs/operators";

logout(): Observable<any>{
  return from(this.userData.getAuthToken()).pipe(mergeMap(token => {
    this.token = token;
    this.headers = new Headers({
      "X-USER-TOKEN": token
    });
    this.options = new RequestOptions({
      headers: this.headers
    });
    var logout_url = "Api logout method";
    return this.http.post(logout_url, {}, this.options).map(res => res.json());
  }));
}
2
Sunil Garg