कोणीय 2 विलय अवलोकन

Question

मुझे कुछ अवलोकनों के साथ परेशानी हो रही है। मुझे एक साथ अच्छा रखने के लिए दो अवलोकन योग्य नहीं लग रहे हैं। वे अपने आप ठीक काम करते हैं, लेकिन मैं दोनों मानों की आवश्यकता है।

db.glass.subscribe((glass: GlassData[]): void => { 
    console.log(glass); // This prints 
}); 

db.cassette_designs.subscribe((cassettes: CassetteData[]): void => { 
    console.log(cassettes): // This prints 
}); 

कि सभी observables से परिचित नहीं किया जा रहा है, पहली बात मैंने कोशिश की एक दूसरे के अंदर घोंसला बनाने से था, लेकिन भीतरी एक कुछ भी करने को नहीं लगता है। अगर वहाँ observables गठबंधन करने के लिए था एक बेहतर तरीका

db.glass.subscribe((glass: GlassData[]): void => { 
    console.log(glass); // This prints 

    db.cassette_designs.subscribe((cassettes: CassetteData[]): void => { 
    console.log(cassettes): // This doesn't 
    }); 
}); 

इसमें कुछ समय तो मैं गूगल पर खोजा गया देखने के लिए होने के लिए मूर्खतापूर्ण लग रहा था और यह पता चला है वहाँ कुछ कर रहे हैं। मैंने zip और forkJoin की कोशिश की क्योंकि वे सबसे ज्यादा पसंद करते थे, लेकिन उनके साथ कुछ भी काम नहीं करेगा।

Observable.zip(db.cassette_designs, db.glass, (cassettes: CassetteData[], glass: GlassData[]): void => { 
    console.log(cassettes); // doesn't print 
    console.log(glass ); // doesn't print 
}); 

Observable.forkJoin([ db.cassette_designs, db.glass ]).subscribe((data: any): void => { 
    console.log(data); // doesn't print 
}); 

मैं कार्यों बुला नहीं कर रहा हूँ के रूप में सही ढंग से यह रूप में सरल कुछ हो सकता है, लेकिन मैंने सोचा है था मैं कुछ बिंदु पर चेतावनी या त्रुटि के कुछ प्रकार मिलेगा। tsc को कोड के साथ कोई समस्या नहीं है और मुझे क्रोम या फ़ायरफ़ॉक्स पर डेवलपर कंसोल में कोई संदेश नहीं मिला है।

अद्यतन

मैं combineLatest की कोशिश की है, लेकिन यह अभी भी कंसोल में कुछ भी प्रदर्शित नहीं करता है। मुझे कुछ याद आना चाहिए, लेकिन मुझे यकीन नहीं है कि क्या। वे व्यक्तिगत रूप से काम करते हैं।

... 

public Listen(event: string): Observable<Response> 
{ 
    return new Observable<Response>((subscriber: Subscriber<Response>): Subscription => { 
    const listen_func = (res: Response): void => subscriber.next(res); 

    this._socket.on(event, listen_func); 

    return new Subscription((): void => 
     this._socket.removeListener(event, listen_func)); 
    }); 
} 

... 

तो वास्तव में observables मैं एक प्रासंगिक घटना पर प्रतिक्रिया के लिए सुनने भेज पाने के लिए:

Observable.combineLatest(db.cassette_designs, db.glass, (cassettes: CassetteData[], glass: GlassData[]): void => { 
    console.log(cassettes); // doesn't print 
    console.log(glass ); // deson't print 
}); 

observables निम्नलिखित तरीके से बनाते हैं। जैसे

... 

public cassette_designs: Observable<CassetteData[]>; 

... 

this.cassette_designs = _socket.Listen("get_cassette_designs") 
    .map((res: Response) => res.data.data); 

Answer 1

मैं combineLatest काम करने के लिए वास्तव में देखकर काम करने में कामयाब रहा।

मूल रूप से मैं यह कर रहा था:

Observable.combineLatest(db.cassette_designs, db.glass, (cassettes: CassetteData[], glass: GlassData[]): void => { 
    console.log(cassettes); 
    console.log(glass ); 
}); 

अब मैं यह कर रहा हूँ:

Observable.combineLatest(db.cassette_designs, db.glass).subscribe((data: any[]): void => { 
    console.log(data); 
    // cassettes - data[0] 
    // glass  - data[1] 
}); 

Answer 2

अरे आप एक एकल स्ट्रीम (नमूदार) है कि 2 स्रोतों का एक संयोजन डेटा का उत्सर्जन करता है है combineLatest विधि की जाँच करना चाहते हैं।

Answer 3

उनमें से दोनों: Observable.zip और Observable.forkJoin को काम करना चाहिए। (व्यक्तिगत रूप से, मैं 'फोर्कजोइन' पसंद करता हूं - यह एक ही क्रम के साथ एक सरणी देता है, जैसा कि आपने अवलोकन को धक्का दिया है, और आपको बहुत सारे तर्कों की आवश्यकता नहीं है)

शायद, यदि आप मैन्युअल रूप से अवलोकन कर रहे हैं (Observable.create ...), आप केवल 'निर्माण' विधि से प्रदान किए गए पर्यवेक्षकों दोनों के लिए 'पूर्ण' कॉल करना भूल गए हैं।

Answer 4

अपनी खोज के साथ पालन करने के लिए:

1) एक Observable एक आलसी निष्पादन है डेटा प्रकार, इसका मतलब है कि यह पाइपलाइन में कुछ भी निष्पादित नहीं करेगा जब तक कि यह सब्सक्राइब नहीं हो जाता है। यह संयोजक ऑपरेटरों के लिए भी जाता है। zip, forkJoin, combineLatest, और withLatestFrom सभी Observables पर पुनः सदस्यता लेंगे कि आप के बाद उन्हें केवल सदस्यता प्राप्त करते हैं।

इसलिए

:

var output = Observable.combinelatest(stream1, stream2, (x, y) => ({x, y})); 

वास्तव में कुछ नहीं करेंगे जब तक आप output.subscribe(), जिस बिंदु पर subscribe भी stream1 और stream2 पर कहा जाता है कहते हैं और आप आरएक्स के सभी जादू मिलता है।

2) एक और मामूली बिंदु लेकिन जब भी आप अपनी खुद की रचना विधियों को शुरू करना शुरू करते हैं, तो यह देखने के लिए पहले दस्तावेज पर एक नज़र डालें कि यह पहले से मौजूद है या नहीं। Arrays, Promises, नोड-स्टाइल कॉलबैक और हाँ मानक event patterns के लिए स्थिर निर्माण विधियां हैं।

इस प्रकार अपने Listen विधि बन सकता है:

public Listen<R>(event: string): Observable<R> { 
    return Observable.fromEvent(this._socket, event); 
} 

Answer 5

मैं combineLatest का उपयोग किया है। मुझे तीन एपीआई कॉल की आवश्यकता थी, लेकिन मैं केवल तीन ऑब्जेक्ट्स को मिलाकर एक ऑब्जेक्ट चाहता था।

मैं सूत्र यह एक ही पोस्ट में उल्लेख करने के लिए का पालन किया है:

var output = Observable.combinelatest(stream1, stream2, (x, y) => ({x, y})); 

अंतिम कोड होने के नाते:

getGobalStats(): Observable<any> { 

    let obs1 = this._http.get(this._config.getGlobalStatsUrl(), this._config.getOptions()) 
     .map((res: Response) => { 
     return res.json().content; 
     }) 
     .catch((error: any) => { console.error(error); return error; }); 
    let obs2 = this._http.get(this._config.getGlobalStatsUrl() + '?type=1', this._config.getOptions()) 
     .map((res: Response) => { 
     return res.json().content; 
     }) 
     .catch((error: any) => { console.error(error); return error; }); 
    let obs3 = this._http.get(this._config.getGlobalStatsUrl() + '?type=3', this._config.getOptions()) 
     .map((res: Response) => { 
     return res.json().content; 
     }) 
     .catch((error: any) => { console.error(error); return error; }); 

     return Observable.combineLatest(obs1,obs2,obs3,(res1,res2,res3) => { return {all:res1,running: res2, cycling: res3}}); 
    } 

Answer 6

 Observable.merge(
      Observable.fromEvent(canvasEl, 'mousedown'), Observable.fromEvent(canvasEl, 'touchstart')) 
      .switchMap((e) => { 
       return Observable.merge(
        Observable.fromEvent(canvasEl, 'mousemove').takeUntil(Observable.fromEvent(canvasEl, 'mouseup')), 
        Observable.fromEvent(canvasEl, 'touchmove').takeUntil(Observable.fromEvent(canvasEl, 'touchend')), 
       ) 
        .pairwise() 
      }) 
      .subscribe(...