inject関数
inject関数で依存関係を解決します。
「inject関数」はCoddyKit上の無料Angular Academyレッスンです。 これはレッスン2/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはAngular Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Angular Academyコースには全4レッスンが含まれています。
inject関数
inject()関数は、インジェクターから依存関係を取得します。これは、コンストラクターのパラメーターによる注入に代わる現代的な方法です。
基本的な使い方
取得したいクラスを指定してinjectを呼び出し、その結果をフィールドに代入します。
import { Component, inject } from '@angular/core';
import { DataService } from './data.service';
@Component({ selector: 'app-x', template: '' })
export class XComponent {
private data = inject(DataService);
}コンストラクター注入との比較
従来の書き方では、依存関係をコンストラクターのパラメーターとして宣言します。inject()はフィールド初期化子として同じ役割を果たすため、多くの場合よりすっきりと記述できます。
// old style:
// constructor(private data: DataService) {}injectを呼び出せる場所
inject()はインジェクションコンテキスト内で実行する必要があります。たとえば、コンポーネント、ディレクティブ、サービスの構築中や、フィールド初期化子、providerのファクトリ関数内などです。
サービスでの注入
サービス内でもinjectを使用できます。たとえば、HttpClientを取得する場合に使います。
import { Injectable, inject } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Injectable({ providedIn: 'root' })
export class Api {
private http = inject(HttpClient);
}定型コードを減らす
injectを使うと、長いコンストラクターのシグネチャを避けられます。各依存関係が単純なフィールド宣言になるため、読みやすく、順序の変更も簡単です。
注入したサービスの使用
注入したサービスは、通常のオブジェクトと同じように呼び出せます。
export class XComponent {
private store = inject(CounterStore);
add() { this.store.increment(); }
}関数型ガードでのinject
関数型のルートガードとリゾルバーはインジェクションコンテキストで実行されるため、その中でinjectを呼び出してサービスにアクセスできます。
// export const authGuard = () => {
// const auth = inject(AuthService);
// return auth.isLoggedIn();
// };オプションの依存関係
injectにはオプションを指定できます。たとえば、依存関係が提供されていない場合にエラーをスローせずnullを返すよう、依存関係をオプション扱いにできます。
// const logger = inject(Logger, { optional: true });インジェクションコンテキストの外側
インジェクションコンテキストの外側（たとえばsetTimeoutのコールバック内）でinjectを呼び出すと、エラーがスローされます。代わりに、構築時に依存関係を取得しておいてください。
injectを推奨する理由
injectはミックスイン、基底クラス、関数型APIと相性がよく、コンポーネントクラスを簡潔に保てます。現代のAngularでは推奨される方法です。
クイックチェック: inject
依存関係を取得する。
まとめ: inject
コンポーネント、サービス、関数型ガードで、インジェクションコンテキスト内で依存関係を取得する現代的な方法としてinject()関数を学びました。コンストラクター注入より定型コードを減らせ、optionalなどのオプションにも対応しています。次はproviderとスコープです。
よくある質問
「inject関数」レッスンは無料ですか？
はい。「inject関数」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、Angular Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Angular Academyコースには全4レッスンが含まれています。
「inject関数」で何を学びますか？
inject関数で依存関係を解決します。 ブラウザで直接実行するハンズオンコードでAngular Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
Angular Academyを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのAngular Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン2/4です。
「inject関数」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このAngular Academyレッスンでコードを書いて実行できますか？
はい。すべてのAngular Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。