注入可能なサービスの作成

Angularの依存性の注入(DI)は、フレームワークの最も強力な機能の1つです。依存性の注入は、Angularが実行時にアプリケーションが必要とするリソースを_提供_できる機能であると考えてください。依存性は、サービスやその他のリソースである可能性があります。

NOTE: エッセンシャルガイドの依存性の注入で詳しく学ぶことができます。

このアクティビティでは、注入可能なサービスを作成する方法を学びます。


サービスを使用する1つの方法は、データやAPIとの対話方法として機能させることです。サービスを再利用可能にするため、サービス内のロジックを保持し、必要に応じてアプリケーション全体で共有する必要があります。

クラスをDIシステムによって注入されるようにするには、@Serviceデコレーターを使用します。例えば:

@Service()
class UserService {
  // データを取得して返すためのメソッド
}

@Serviceデコレーターは、クラスをサービスとしてマークし、DIシステムにUserServiceがアプリケーション内のどこからでもアクセスできることを通知します。デフォルトでは、Angularはアプリケーション全体でサービスを提供するため、追加の構成を記述する必要はありません。

NOTE: デフォルトでは、@Serviceはクラスをルートインジェクターで提供します。特定のルートやコンポーネントにスコープを限定するなど、手動で提供したい場合は、autoProvided: falseを設定します。詳しくはサービスの作成と使用に関するガイドをご覧ください。

では、試してみましょう。

  1. @Serviceデコレーターを追加する

    car.service.tsのコードを更新して、CarServiceクラスに@Service()デコレーターを追加します。

    TIP: 上記の例を使用して、正しい構文を確認してください。

よくできました👍このサービスは今や注入可能になり、気軽に組み込めます。サービスが注入可能になったので、コンポーネントに注入してみましょう👉