2016-06-23 21 views
8

Bir İyonik 2 uygulamasında depodan bir veri parçasını almam ve daha sonra bir HTTP isteği oluşturmak için bu verileri kullanmam gereken bir durum var. Çalıştığım sorun, SqlStorage yöntemlerinin vaatler vermesi ve http meth'in bir gözlenebilirleri döndürmesidir. Ben işe gitmek için böyle bir şey yapmak için yaşıyorum:İyonik 2/Açısal 2 söz geri dönen gözlenebilir

getToken() { 
    return this.storage.get('token').then((token) => { 
     this.token = token; 
     return token; 
    }); 
} 

loadStuff(){ 
    return this.tokenService.getToken().then(token => { 
     return this.http.get("https://www.urltodatasource.com/api/v1/Endpoint?access_token="+token).map(res => res.json()); 
    }); 
    } 

ve sonra işe almak için böyle bir şey yaptığını:

this.tokenService.loadStuff().then(observable => { 
    observable.subscribe(data => { 
     this.storage.set('stuff', data); 
     return data; 
    }); 
}) 

Ben Açısal ve İon çok yeniyim Genel olarak, yapmaya çalıştığım şeyi başarmanın çok daha iyi bir yolu varmış gibi hissediyorum, ama nasıl olduğunu bilmiyorum. Ayrıca, gözlenebilirler hakkında mevcut tüm kaynakların, çok çok çok hızlı bir şekilde, çok hızlı bir şekilde benim gibi çok etkileyici bir genç geliştirici bırakıyor.

Bunu nasıl daha iyi yapabileceğine kim ışık tutabilir? Teşekkürler!

+0

'loadStuff' içinde' this.http' Angular2 'Http' hizmetidir? – yarons

+0

Yup @yarons öyle. Normal Http hizmeti, dosyanın en üstünde içe aktarılır ve "StuffService" in yapıcısına bir bağımlılık olarak eklenir. – TheBrockEllis

cevap

2

Köşeli 2'de, Http hizmet işlevleri (get, post, vb.) Bir Observable object döndürür. Bu, onu uyguladıkları yoldur.

Söz verir ve hizmetinizin yerine bir söz vermesini istiyor iseniz, Observable nesnelerinde bulunan toPromise işlevini kullanabilirsiniz.

loadStuff(){ 
    return this.tokenService.getToken().then(token => { 
     return this.http.get("https://www.urltodatasource.com/api/v1/Endpoint?access_token="+token).toPromise()); 
    }); 
} 

Sonra

İşte
this.tokenService.loadStuff().then(data => { 
    data = data.json(); //you might need to do that, depending on the structure of the response 
    this.storage.set('stuff', data); 
    return data; 
});  
9

Yapabileceğiniz ne:

Kodunuz

getToken: Observable<any> = 
    Observable.fromPromise(this.storage.get('token').then(token => { 
    //maybe some processing logic like JSON.parse(token) 
    return token; 
})); 
değişiklik
getToken() { 
    return this.storage.get('token').then((token) => { 
     this.token = token; 
     return token; 
    }); 
} 

altında

Ardından, bileşeninizde bunu diğer gözlemlenebilir gibi kullanabilirsiniz. Ayrıca, bu ithalat eklemeniz gerekir

getToken() { 
    return Observable.fromPromise(this.storage.get('token') 
    .then((token) => { 
     return token; 
    })); 
} 

loadStuff(){ 
    return this.tokenService.getToken() 
    .flatMap(token => { 
     return this.http.get("https://www.urltodatasource.com/api/v1/Endpoint?access_token="+token) 
     .map(res => { 
      return res.json(); 
     }); 
    }); 
} 

this.tokenService.loadStuff().subscribe(data => { 
    this.storage.set('stuff', data); 
    return data; 
}); 

:

this.serviceClass.getToken.subscribe(token => { 
//whatever you want to with the token 
}); 
+1

Foget yapma: import {Gözlemlenebilir} from "rxjs"; – Harold

+0

Bir çekicilik gibi çalışır, teşekkürler! –

1

Ben Observable.fromPromise() ve .flatMap() bir arada kullanarak işe aldım

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

Kullanım 'Observable.fromPromise '' sözünü gözlemlenebilir hale getirecek.