角2 - 他のコンポーネントの関数の使い方は？

Question

3つのコンポーネントがあり、そのうちの1つに他のコンポーネントで使用したい機能がいくつかあるとします。これらのコンポーネントはすべて同じレベル（兄弟）にあります。

file1.ts 
export class ComponentWithFunction() { 
    function getData() { 
     console.log('data has been fetched'); 
    } 
} 

file2.ts 
export class ComponentA() { 
    // here I want to have possibility to use getData 
} 

file3.ts 
export class ComponentB() { 
    // here I want to have possibility to use getData 
} 

私は、他のコンポーネントからのgetData機能へのアクセス権を持っているために何をすべきか？ SharedServiceを作成して指定されたコンポーネントに挿入することはできますが、静的関数などを使用する方法はありますか？

はあなたに

Answer 1

なぜコンポーネントをありがとうございましたか！ Angular 2では、データを取得するためにサービスを使用し、別のサービスへのデータアクセスをリファクタリングする必要があるため、コンポーネントをリーンに保ち、ビューのサポートに重点を置いています。また、モックサービスでコンポーネントを単体テストすることも容易になります。

あなたはservice各Componentにあなたがその機能を使用する場合、使用することをserviceとinjectにそれを置くことができます。

はapp module's providersにそのサービスを追加し、よりService in Angular 2参照してください

file1.ts 

@Injectable() 
export class ComponentWithFunction() { 
    function getData() { 
     console.log('data has been fetched'); 
    } 
} 

file2.ts 
export class ComponentA() { 
    constructor(private service: ComponentWithFunction) 
} 

file3.ts 
export class ComponentB() { 
    constructor(private service: ComponentWithFunction) 
} 

のようなコンストラクタで注入します。

Answer 2

だから、多分異なる例です。

私は、コンポーネントがページ上のモーダル要素を担当しているとします。 このようなコンポーネントのコンテキストには、論理、オープン、クローズ、リフレッシュなどのメソッドがあります。

異なるコンポーネントからopen（）メソッドやclose（）メソッドを使用するには、サービスとしてModalを作成して、それを正しく使用したい場所に挿入する必要があります。 Modalからイベント/メソッドを購読するオプションはありませんか？経験則として