2016-05-02 23 views
13

एक वेब आवेदन टाइपप्रति में Angular2 के साथ लिखा के लिए करने के लिए प्रत्यक्ष की सरणी, मैं RxJs Observable रों के साथ काम करने की जरूरत है।
जैसा कि मैंने पहले rxjs इस्तेमाल कभी नहीं किया है और मैं सामान्य रूप में reactiveprogramming लिए नया हूँ, मैं कभी कभी कुछ कुछ विशेष काम करने के लिए सही तरीके से खोजने कठिनाइयों की है।
अब मैं एक समस्या का सामना कर रहा हूँ। जहां मैं एक Observable<Array<T>> में एक Array<Observable<T>> कन्वर्ट करना होगा।
मैं एक उदाहरण के साथ यह समझाने की कोशिश करेंगे:
- मैं एक Observable जो मुझे Users (Observable<Array<User>>)
की एक सूची देता है, - User स्तरीय एक समारोह getPosts एक Observable<Array<Post>> लौटने है।
- onNext फ़ंक्शन के अंदर सभी Post एस का मूल्यांकन करने के लिए मुझे Observable<Array<User>> को Observable<Array<Post>> पर मैप करने की आवश्यकता है।RxJs सरणी

मैं आसानी से
map((result : Array<User>) => result.map((user : User) => user.getPosts()))
ans का उपयोग कर Observable<Array<Observable<Array<Post>>>> को Observable<Array<User>> से मैप कर सकते हैं मैं एक Array<Post> में एक Array<Array<Post>> समतल कर सकते हैं।
हालांकि मुझे Observable<Array<Observable<Array<Post>>>> को Observable<Array<Array<Post>>>
में मैप करने का सही तरीका नहीं मिल रहा है, अब तक मैंने के साथ combineLatest फ़ंक्शन का उपयोग किया था।
मेरे लिए यह काम करने के लिए लग रहा था और संपादक मैं प्रयोग किया जाता है (एटम संपादक) किसी भी त्रुटि नहीं दिखा। हालांकि अब मैं नेटबीन्स का उपयोग करता हूं, जो मुझे इस कोड में एक त्रुटि दिखाता है। त्रुटियों में "tsc" परिणामों का उपयोग करके कोड को संकलित करना भी।
इस तरह देखो:

Argument of type '(result: Post[]) => void' is not assignable to parameter of type 'NextObserver<[Observable<Post>]> | ErrorObserver<[Observable<Post>]> | CompletionObserver<[...'. 
Type '(result: Post[]) => void' is not assignable to type '(value: [Observable<Post>]) => void'. 

तो मेरे सवाल है:
मैं कैसे "समतल" कर सकते हैं Observables के Array एक Array में?

+0

'getPosts' विधि से क्या मेल खाता है? क्या यह किसी विशिष्ट उपयोगकर्ता की पोस्ट लोड करता है? –

उत्तर

22

flatMap ऑपरेटर ऐसा करने की अनुमति देता है। मैं पूरी तरह से तुम क्या करने की कोशिश क्या समझ नहीं करते हैं लेकिन मैं एक जवाब प्रदान करने के लिए कोशिश करता हूँ ...

आप लोड सभी

getPostsPerUser() { 
    return this.http.get('/users') 
    .map(res => res.json()) 
    .flatMap((result : Array<User>) => { 
     return Observable.forkJoin(
     result.map((user : User) => user.getPosts()); 
    }); 
} 

Observable.forkJoin आप सभी observables के लिए के लिए प्रतीक्षा करने की अनुमति देता है चाहते हैं प्राप्त डेटा

this.getPostsPerUser().subscribe(result => { 
    var postsUser1 = result[0]; 
    var postsUser2 = result[1]; 
    (...) 
}); 
+1

हाँ 'getPosts() 'एक' अवलोकन योग्य >' देता है। तो मुझे लगता है कि मैं क्या देख रहा हूँ। मैं इसे आशुलिपित करने की कोशिश करूंगा और आपको बताऊंगा कि यह काम करता है या नहीं।धन्यवाद – Springrbua

+0

पूरी तरह से काम करता है। मैं केवल 'फोर्कजॉइन' के साथ 'combineLatest' को प्रतिस्थापित करने के लिए टोपी। आपका बहुत बहुत धन्यवाद! – Springrbua

3

आप उपयोग कर सकते हैं समारोह rxjs पद्धति पर लागू होते हैं:

कोड ऊपर मानता है कि user.getPosts() रिटर्न एक नमूदार ...

इस के साथ, आप पदों की सरणी की एक सरणी प्राप्त होगा आप इस तरह से करना चाहते हैं,:

const source1 = Rx.Observable.interval(100) 
 
    .map(function (i) { return 'First: ' + i; }); 
 

 
const source2 = Rx.Observable.interval(150) 
 
    .map(function (i) { return 'Second: ' + i; }); 
 

 
const observablesArray = [source1, source2]; 
 

 
const sources = Rx.Observable.combineLatest 
 
.apply(this, observablesArray).take(4) 
 

 
// or 
 

 
const sources = Rx.Observable 
 
       .combineLatest(...observablesArray) 
 
       .take(4) 
 

 
sources.subscribe(
 
    (response) => { 
 
    console.log(response); 
 
    } 
 
)
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.0.1/Rx.min.js"></script>

+0

मुझे लगता है कि यह काम करना चाहिए, लेकिन मैं अभी के लिए 'forkJoin' के साथ रहना होगा। – Springrbua

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