Non puoi semplicemente restituire il valore direttamente perché è una chiamata asincrona. Una chiamata asincrona significa che è in esecuzione in background (in realtà pianificata per l’esecuzione successiva) mentre il codice continua a essere eseguito.

Inoltre non puoi avere un codice del genere direttamente nella class. Deve essere spostato in un metodo o nel costruttore.

Quello che puoi fare è non subscribe() direttamente ma usare un operatore come map()

 export class DataComponent{ someMethod() { return this.http.get(path).map(res => { return res.json(); }); } } 

Inoltre, è ansible combinare più .map con gli stessi Osservabili, poiché a volte ciò migliora la chiarezza del codice e mantiene le cose separate. Esempio:

 validateResponse = (response) => validate(response); parseJson = (json) => JSON.parse(json); fetchUnits() { return this.http.get(requestUrl).map(this.validateResponse).map(this.parseJson); } 

In questo modo verrà restituito un osservabile a cui il chiamante può iscriversi

 export class DataComponent{ someMethod() { return this.http.get(path).map(res => { return res.json(); }); } otherMethod() { this.someMethod().subscribe(data => this.data = data); } } 

Il chiamante può anche essere in un’altra class. Qui è solo per brevità.

 data => this.data = data 

e

 res => return res.json() 

sono funzioni di freccia. Sono simili alle normali funzioni. Queste funzioni vengono passate a subscribe(...) o map(...) per essere chiamate dall’osservabile quando i dati arrivano dalla risposta. Questo è il motivo per cui i dati non possono essere restituiti direttamente, perché quando un someMethod() è completato, i dati non sono ancora stati ricevuti.

Due modi che conosco:

 export class SomeComponent implements OnInit { public localVar:any; ngOnInit(){ this.http.get(Path).map(res => res.json()).subscribe(res => this.localVar = res); } } 

Questo assegnerà il risultato alla variabile locale una volta che le informazioni vengono restituite come in una promise. Quindi fai {{ localVar }}

Un altro modo è ottenere un osservabile come variabile locale.

 export class SomeComponent { public localVar:any; constructor() { this.localVar = this.http.get(path).map(res => res.json()); } } 

In questo modo stai esponendo un osservabile a quel punto che puoi fare nel tuo html è usare AsyncPipe {{ localVar | async }} {{ localVar | async }}

Per favore provalo e fammi sapere se funziona. Inoltre, poiché angular 2 è piuttosto nuovo, sentiti libero di commentare se qualcosa non va.

Spero che sia d’aiuto

Ho usato in questo modo tanto tempo …

 @Component({ selector: "data", template: "
{{ getData() }}
" }) export class DataComponent{ this.http.get(path).subscribe({ DataComponent.setSubscribeData(res); }) } static subscribeData:any; static setSubscribeData(data):any{ DataComponent.subscribeData=data; return data; }