2016-06-23 22 views
8

मेरे पास ऐसी स्थिति है जहां मुझे एक आयनिक 2 एप्लिकेशन में स्टोरेज से डेटा का एक टुकड़ा लाने की आवश्यकता है और फिर उस डेटा का उपयोग HTTP अनुरोध बनाने के लिए करें। जिस समस्या में मैं दौड़ रहा हूं वह यह है कि एसक्लस्टोरेज विधियों के वादे वापस आते हैं और http मेथ एक अवलोकन करता है। मैं यह काम करने के लिए प्राप्त करने के लिए इस तरह कुछ करने के लिए आ रही हैं:आयनिक 2/कोणीय 2 वादे लौटने योग्य

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

और फिर इसे काम करने के लिए प्राप्त करने के लिए कुछ इस तरह कर रही है:

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

मैं बहुत कोणीय और आयोनिक के लिए नया हूँ आम तौर पर, इसलिए मुझे लगता है कि मैं जो करने की कोशिश कर रहा हूं उसे पूरा करने का एक बेहतर तरीका है, लेकिन मुझे नहीं पता कि कैसे। इसके अलावा, अवलोकन के बारे में सभी उपलब्ध संसाधन बहुत जटिल बहुत जल्दी से मेरे जैसे एक प्रभावशाली युवा डेवलपर को बहुत भ्रमित करते हैं।

क्या कोई इसे बेहतर तरीके से करने के बारे में कुछ प्रकाश डाल सकता है? धन्यवाद!

+0

'लोडस्टफ' में, यह Angular2 'Http' सेवा है। – yarons

+0

यूप @ यरन्स यह है। फ़ाइल के शीर्ष पर सामान्य एचटीपी सेवा आयात की जा रही है और मेरे "स्टफ सेवा" के निर्माता में निर्भरता के रूप में जोड़ा गया है। – TheBrockEllis

उत्तर

2

कोणीय 2 में, Http सेवा फ़ंक्शन (get, post, आदि) Observable object लौटाएं। यह वही तरीका है जिसने इसे लागू किया है।

यदि आप वादे करने के लिए उपयोग किए जाते हैं, और अपनी सेवा को इसके बजाय वादा वापस करने की इच्छा रखते हैं, तो आप toPromise फ़ंक्शन का उपयोग कर सकते हैं जो Observable ऑब्जेक्ट्स में बनाया गया है।

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

और फिर

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

यहाँ आप क्या कर सकते हैं:

आपका कोड नीचे

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

परिवर्तन

getToken: Observable<any> = 
    Observable.fromPromise(this.storage.get('token').then(token => { 
    //maybe some processing logic like JSON.parse(token) 
    return token; 
})); 
के लिए

फिर अपने घटक में आप इसे किसी भी अन्य देखने योग्य की तरह उपभोग कर सकते हैं।

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

धूमकेतु मत करो: "आरएक्सजेएस" से आयात {पर्यवेक्षण}; – Harold

+0

एक आकर्षण की तरह काम करता है, धन्यवाद! –

1

मैं Observable.fromPromise() और .flatMap() के संयोजन का उपयोग काम करने के लिए मिल गया

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

उपयोग 'Observable.fromPromise वादे को देखने योग्य करने के लिए '

संबंधित मुद्दे