관찰 할 수있는 모든 가입자 요소에 데이터 전송 - angular2

Question

'모달'이라는 모든 요소에 데이터를 보내려고하지만 그 중 하나만 메시지를 수신합니다.

@Injectable() 
export class ModalService { 

private _isOpen = new Subject(); 
isOpen$ = this._isOpen.asObservable(); 

open(id: string) { 
    this._isOpen.next({isOpen: true, id: id}); 
} 

close(id: string) { 
    this._isOpen.next({isOpen: false, id: id}); 
} 

및 구성 요소 :

import {Component, Input} from 'angular2/core'; 
import {Observable} from 'rxjs/Observable'; 
import {Subject} from 'rxjs/Subject'; 

import {ModalService} from './modal.service'; 


@Component({ 
    selector: 'modal', 
    template: ` 
    <ng-content></ng-content>`, 
    styleUrls: ['app/workshop/modal.component.css'], 
    providers: [ModalService], 

}) 

export class ModalComponent { 

@Input() ID; 

private show = false; 

constructor(private _modal: ModalService) { 

    this._modal.isOpen$.subscribe(
     (value) => { 
      console.log(value) 
      if(this.ID === value.id) { 
       this.show = value.isOpen; 
      } 
     } 
    ); 

} 

open() { 
    this._modal.open(this.ID); 
} 

close() { 
    this._modal.close(this.ID); 
} 

} 

모두 잘 작동하지만 난 어떤 다른 구성 요소에 서비스를 주입하고 가입자의 나머지 메시지를 전송하고자 할 때 문제가 나타납니다

나는 서비스가 있습니다. 모달의 모든 요소 유형에 대해 메시지를 공유 할 수있는 방법을 모르겠습니다. DOM 요소를 후크 할 수 있지만 구성 요소에 문제가 있습니다. 내가 어떻게 '모든 모달'요소를 관찰 할 수 있도록 연결시킬 수 있습니까? 도움

Answer 1

에 대한

덕분에 실제로, 당신은이 모든 구성 요소에 동일한 인스턴스를 공유 할 필요가있다. 이를 위해 기본 구성 요소의 providers 속성에 서비스를 설정하십시오.

@Component({ 
    (...) 
    providers: [ ModalService ] 
}) 
export class AppComponent { 
    (...) 
}