Angular2他のコンポーネントに選択された値を渡す方法

Question

こんにちは私はオプションの1つから値を選択して渡しています。 ngModelを使用して値を保存しましたが、他のコンポーネントに渡す方法がわかりません。彼らは接続されているが入れ子になっていないので、私はEventemiiterを使用すると考えているEventemitterを使用できませんでした。子コンポーネントのセレクタを使用して、親コンポーネントのコンポーネントをネストする必要があります。

これらの2つのコンポーネントは分離されており、選択した値を他のコンポーネントに渡したいのですか？どうすればこれを達成できますか？

以下は私のコードです。

コンポーネント1のテンプレート

<div> 
    <select (change)="printValue()" formControlName="dogName" 
    class="form-control" 
    class="selectionbox" 
    [(ngModel)]="selected_dog" required> 

    <option *ngFor="let d of dogs" [ngValue]="d"> 
    {{d.dogName}} 
    </option> 
    </select> 

コンポーネント1のコンポーネント

 selected_dog: string; 
    printValue() { 
    console.log (this.selected_dog)} // checked if the value is properly stored. 

そして今、私はCOMPONENT2に 'selected_dog' の値を渡したいです。 COMPONENT2

 value1: string; //how to pass selected_dog value to component2's value1. 

は、私は事前にあなたの助けに感謝（持つEventEmitter、出力/入力？/ NG-コンテンツ？）

を使用するかわからないです。

Answer 1

サービスを作成して変数値を保存し、その2つのコンポーネントにわたって変数を使用することをお勧めします。

@Injectable() 
export class AppMessageService { 
    value1: string; 
    constructor() { 
    this.value1=""; 
    } 
} 

setValue(data: string) { 
this.value1= data; 
} 

getValue() { 
return this.value1; 
} 

上記のサービスを注入し、setValueを使用して第1コンポーネントの値と第2コンポーネントのgetValueを設定します。

Answer 2

サービスでは、値を取得することで問題が発生した場合は、変数を静的にし、注入することなく変数にアクセスするだけで、 AppMessageService.value1のようにアクセスできます。