Angular2がサービスからコンポーネントを呼び出す

Question

ComponentのメソッドをServiceから呼び出しようとしています。これを行う適切な方法は何ですか？ Observableを作成するのにrxjs Subjectを使用しようとしましたが、起動できません。

import {Subject} from 'rxjs/Subject'; 
    export class MyService { 
     callComponent = function(value) { 

      let invokeEvent = new Subject(); 

      invokeEvent.next({some:value}) 
     } 
    } 

と私のコンポーネントで

export class MyComponent { 
    constructor(private _myService: MyService) { 
      this._myService.invokeEvent.subscribe(value => console.log(value)) 
      } 

} 

Answer 1

ここplunkerです：この

import {Subject} from 'rxjs/Subject'; 

@Injectable() 
export class MyService { 

    invokeEvent:Subject<any> = new Subject(); 


    callComponent(value) { 
     this.invokeEvent.next({some:value}) 
    } 
} 

は、あなたのコンポーネント

にそれを提供することを忘れてはいけないよう http://plnkr.co/edit/WKSurRJMXo5JZOPrwSP5?p=preview

は、あなたのサービスを変更

@Component({ 
    selector: 'my-component', 
    template: ` 
    `, 
    providers: [MyService] 
}) 
export class MyComponent { 
     constructor(private _myService: MyService) { 
     this._myService.invokeEvent.subscribe(value => console.log(value)); 
     setTimeout(()=>{ 
      this._myService.callComponent(1); 
     },1000); 
     } 
} 

また、このサービスをグローバル共有サービスにしたい場合は、それをあなたのブートストラップ（古い）またはngModuleに入れて（提供して）、アプリケーション全体で同じシングルトンインスタンスを共有します。

Answer 2

サービスでObservableを定義すると、Observableをコンポーネントから購読することができます。

//サービス

import { Injectable, Inject } from '@angular/core'; 
import { Subject } from 'rxjs/Subject'; 
@Injectable() 
export class MyService { 
    private notify = new Subject<any>(); 
    /** 
    * Observable string streams 
    */ 
    notifyObservable$ = this.notify.asObservable(); 

    constructor(){} 

    public notifyOther(data: any) { 
    if (data) { 
     this.notify.next(data); 
    } 
    } 

    callComponent(value){ 
    this.notify.next({some:value}); 
    } 
} 

//コンポーネント

import { Component, OnInit, OnDestroy } from '@angular/core'; 
import { Subscription } from 'rxjs/Subscription'; 

import { MyService } from './my.service'; 
export class MyComponent { 
    private subscription: Subscription; 
    constructor(private _myService: MyService){ 
    } 

    ngOnInit() { 
    this.subscription = this._myService.notifyObservable$.subscribe((value) => { 
     console.log(value); 
    }); 
    } 

    ngOnDestroy() { 
    this.subscription.unsubscribe(); 
    } 
} 

Answer 3

import {Subject} from 'rxjs/Subject'; 

export class MyService { 

     private invokeEvent = new Subject(); 

     invokeEvent$ = this.missionConfirmedSource.asObservable(); //<<< this is important to declare invokeEvent with asObservable(); 

     callComponent = function(value) { 
      invokeEvent.next({some:value}) 
     } 
} 


export class MyComponent { 
    constructor(private _myService: MyService) { 
      this._myService 
       .invokeEvent$          //<<< subscribe to invokeEvent$ to get the result 
       .subscribe(value => console.log(value)) 
      } 

}