wie ein Datum von HTTP-Aufruf in Winkeln 2 zurück, wenn der Aufruf Erfolg ist

Question

diese Funktion als Beispiel nehmen:

getSessionInfo() { 
    this._http.get(someCorrectUrlHere) 
    // Don't know what this map function do 
    .map(res => res.json()) 
    // Don't know what this subscribe function do 
    .subscribe(
     data => { 
     if (data.response.statusCode === 200) { 
      ** the data.response.data in this case is an object** 
      return data.response.data; 
     } else { 
      console.log("cant get session info"); 
     } 
     }, 
     err => console.log(err), 
    () => { } 
    ); 
    } 

Was mein Verständnis ist, wird die return data.response.data nicht wirklich etwas zurück, wenn die getSessionInfo() sind namens.

Zum Beispiel ist die this.session noch nicht definiert.

getSession() { 
    this.session = this.service.getSessionInfo(); 
} 

Was ich tun möchte, ist, geben den Wert data.response.data und weisen Sie ihn this.session.

Hinweis, sie sind in verschiedenen Klassen in Angular2 Project.

export class HeaderComponent { 

    service: ApiService; 

    session: Object; 

    constructor(service: ApiService) { 
    this.service = service; 
    this.getSession(); 
    } 

    getSession() { 
    this.session = this.service.getSessionInfo(); 

    // I expect this is the true value I expected, not undefined 
    console.log(this.session); 
    } 

} 

Die ApiService Klasse ist in einem anderen Ordner

@Injectable() 
    export class ApiService { 

     _http: Http; 
     regions: Object; 
    constructor(http: Http) { 
    this._http = http; 
    } 

    getSessionInfo() { 
    ....... 
    } 
} 

Ich weiß, verwendet sie tun können, was ich $ q wollen verwenden, $ defer, aber was soll ich Angular 2

Answer 1

Sie mit

Do return create entweder new Promise/Observable, da Sie .subscribe über beobachtbar verwenden werden. So this._http.get(someCorrectUrlHere) Versprechen von getSessionInfo Methode und dann haben .then mit über getSessionInfo Methode.

getSessionInfo() { 
    //creating custom promise & then resolving and rejecting it on condition. 
    return new Promise((resolve, reject) =>{ 
    this._http.get(someCorrectUrlHere) 
     .map(res => res.json()) 
     .subscribe(
     data => { 
     if (data.response.statusCode === 200) { 
      resolve(data.response.data); //returning data by resolving promise 
     } else { 
      console.log("cant get session info"); 
      reject("Error occured"); 
     } 
     }, 
     err => { 
     console.log(err); 
     reject(err); 
     }, 
    () => {} 
    ); 
    }); 
} 

-Code

export class HeaderComponent { 
    service: ApiService; 
    session: Object; 
    constructor(service: ApiService) { 
    this.service = service; 
    this.getSession(); 
    } 

    getSession() { 
    this.service.getSessionInfo().then(
    //success function. 
    (session) => { 
     this.session = session; 
     console.log(session); 
    }, 
    (error)=>{ 
     //error function 
    }); 
    } 
} 

Answer 2

Sie beobachtbare von Angular 2 http Aufruf zurückgegeben umwandeln kann versprechen, wenn Sie bequem sind mit dieser Arbeit

getSessionInfo() { 
    return this._http.get(someCorrectUrlHere).toPromise(); 
); 

Mehr dazu in der offiziellen Angular Dok. here.

Oder Sie können versuchen, es zu tun Angular 2-Wege. Halten Sie Ihren Dienst als

getSessionInfo() { 
    this._http.get(someCorrectUrlHere) 
    .map(res => res.json()) 
} 

und in Ihrem HeaderComponent abonnieren

getSession() { 
    this.service.getSessionInfo().subscribe(
    data => { 
     if (data.response.statusCode === 200) { 
      this.session = data.response.data; 
      console.log(this.session); 
     } else { 
      console.log("cant get session info"); 
     } 
    }, 
    err => console.log(err), 
    () => { } 
    ); 
}