कोणीय 2 घटना प्रसारण

Question

कोणीय से नया 2. मैं एक ही स्तर के घटक के बीच एक घटना प्रसारित करने पर काम कर रहा हूं। वर्तमान में मुझे पता है EventEmitter बस एक घटना को ऊपरी स्तर के घटक में स्थानांतरित कर सकता है।

मैंने यह this link चेक किया है और पता है कि मेरी समस्या का समाधान करने का एक तरीका हो सकता है, लेकिन उस यूआरएल में नमूना मेरे लिए काम नहीं करता है।

क्या किसी को पता है कि प्रसारण ईवेंट के लिए इसे (अवलोकन योग्य) या किसी अन्य स्तर पर ईवेंट को स्थानांतरित करने के लिए किसी अन्य तरीके से कैसे उपयोग किया जाए?

Answer 1

आपको बस कुछ ऐसी सेवा बनाने की आवश्यकता है जो संदेश को छोड़ दें जिस पर आप सब्सक्राइब कर सकते हैं। यह rxjs Observableसे, EventEmitterसे Node.js, या कुछ और कि Observable pattern इस प्रकार हो सकता है। फिर आपको कंक्रीट घटकों में इस सेवा को इंजेक्ट करने के लिए निर्भरता इंजेक्शन का उपयोग करना चाहिए। this plunker देखें।

class Broadcaster extends EventEmitter {} 

@Component({ 
    selector: 'comp1', 
    template: '<div>Generated number: {{ generatedNumber }}</div>', 
}) 
class Comp1 { 
    generatedNumber: number = 0; 

    constructor(broadcaster: Broadcaster) { 
    setInterval(() => { 
     broadcaster.next(this.generatedNumber = Math.random()); 
    },1000); 
    } 
} 

@Component({ 
    selector: 'comp2', 
    template: '<div>Received number: {{ receivedNumber }}</div>', 
}) 
class Comp2 { 
    receivedNumber: number = 0; 

    constructor(broadcaster: Broadcaster) { 
    broadcaster.observer({ 
     next: generatedNumber => this.receivedNumber = generatedNumber 
    }); 
    } 
} 

@Component({ 
    selector: 'app', 
    viewProviders: [Broadcaster], 
    directives: [Comp1, Comp2], 
    template: ` 
    <comp1></comp1> 
    <comp2></comp2> 
    ` 
}) 
export class App {} 

पुनश्च इस उदाहरण में मैं angular2 से EventEmitter उपयोग करें, लेकिन फिर से, यह आप जो कुछ भी चाहते हो सकता है

Answer 2

उपयोग BehaviorSubject

सेवा:

import { Injectable } from '@angular/core'; 
import {BehaviorSubject} from 'rxjs/BehaviorSubject';  

@Injectable() 
export class MyService { 

    public mySubject: BehaviorSubject<number> = new BehaviorSubject<number>(0); 


    public doSomething(): void { 
     let myValue: number = 123; 
     this.mySubject.next(myValue); 
    } 
} 

घटक :

@Component({ 
    selector: 'app-my-component', 
    templateUrl: './my-component.component.html', 
    styleUrls: ['./my-component.component.css'] 
}) 
export class MyComponent { 

    constructor(private myService: MyService) { 
     this.myService.mySubject.subscribe(
      value => { 
       console.log(value); 
      } 
     ); 
    } 

}