通知イベントを1つのコンポーネントでトリガし、別のコンポーネントをAngular 4でリッスンする方法（コンポーネントに親子関係がない）

Question

別のコンポーネントで何らかのアクティビティを実行した後で、コンポーネントを変更したい。コンポーネントには、親子関係はありません。

Answer 1

プライベートな主題と公衆観察を使って双方向フローで共有サービスを作成することができます。両方のコンポーネントがこれらのオブザーバブルにサブスクライブすることができます。ここで新しい値をプッシュでき、他のオブザーバは新しい値の変更に従って反応します。 plunkerで

Official docs!

コンポーネントは、任意の親子関係はありません。

Working Plunker

@Injectable() 
export class MissionService { 

    // Observable string sources 
    private missionAnnouncedSource = new Subject<string>(); 
    private missionConfirmedSource = new Subject<string>(); 

    // Observable string streams 
    missionAnnounced$ = this.missionAnnouncedSource.asObservable(); 
    missionConfirmed$ = this.missionConfirmedSource.asObservable(); 

    // Service message commands 
    announceMission(mission: string) { 
    this.missionAnnouncedSource.next(mission); 
    } 

    confirmMission(astronaut: string) { 
    this.missionConfirmedSource.next(astronaut); 
    } 
} 

Answer 2

他の構成要素の変化に応じてコンポーネントを更新するためにいくつかの他の良い方法は：

1. 両方が同じ親を共有する場合、あなたは出力親への変更と、親ができ他の子コンポーネントを更新します（入力を更新します）。
2. 共有ストア（例：ng-redux）を使用できます。
3. （何らかの種類のuiルータを使用している）（使用例に依存します）。