InjectionToken – podstawy

przez | 17 listopada 2024

InjectionToken jest mechanizmem służącym do definiowania i wstrzykiwania tokenów w Dependency Injection (DI). Pozwala on na dostarczania obiektów np. wartości konfiguracyjne do komponentów oraz serwisów przez co nie trzeba ich przekazywać przez @Input. InjectionToken jest generykiem InjectionToken<T>, który umożliwia zdefiniowanie typu zwracanej wartości, co pozwala na lepsze typowanie i bezpieczeństwo w aplikacji napisanej w języku TypeScript.

Przykład użycia

Tworzymy nowy InjectionToken dla konfiguracji

import { InjectionToken } from '@angular/core';

// Tworzymy nowy InjectionToken dla konfiguracji
export const CONFIG_TOKEN = new InjectionToken<string>('configToken');

Rejestrowanie wartości z użyciem InjectionToken:

import { ApplicationConfig, provideHttpClient } from '@angular/core';
import { API_URL_TOKEN } from './path-to-your-token';

// Define the AppConfig with providers
export const appConfig: ApplicationConfig = {
  providers: [
    provideHttpClient(),
    { provide: API_URL_TOKEN, useValue: 'https://api.mywebsite.com' }
  ]
};

lub rejestrowanie wartości jeśli korzystamy z NgModule

import { NgModule } from '@angular/core';
import { API_URL_TOKEN } from './path-to-your-token';

@NgModule({
  providers: [
    { provide: API_URL_TOKEN, useValue: 'https://api.mywebsite.com' }
  ]
})
export class AppModule { }

Wstrzykiwanie wartości w komponencie lub serwisie:

import { Component, Inject } from '@angular/core';
import { API_URL_TOKEN } from './path-to-your-token';

@Component({
  selector: 'app-root',
  template: '<h1>Welcome to our application!</h1>'
})
export class AppComponent {
  constructor(@Inject(API_URL_TOKEN) private apiUrl: string) {
    console.log(`API URL: ${this.apiUrl}`);
  }
}

Zalety InjectionToken

Wstrzykiwanie danych konfiguracyjnych: Użycie InjectionToken pozwala na łatwe wstrzykiwanie stałych wartości lub konfiguracji bez potrzeby tworzenia dedykowanych serwisów.

Bezpieczeństwo typów: InjectionToken<T> sprawia, że system DI Angulara rozpoznaje typ wstrzykiwanej wartości, co zapobiega przypadkowym błędom typowania.

Przy zaawansowanych zależnościach: Stosowany, gdy chcemy dostarczać bardziej zaawansowane zależności, takie jak obiekty lub złożone struktury danych.

Lepsza kontrola nad nazwami: Używanie tokenów opartych na stringach może prowadzić do konfliktów, jeśli przypadkowo użyjemy tych samych nazw. InjectionToken jest unikalny, co eliminuje ten problem.

Podsumowując, InjectionToken w Angularze jest potężnym narzędziem, które zwiększa elastyczność i bezpieczeństwo systemu wstrzykiwania zależności. Jest idealne do definiowania niestandardowych tokenów, co pozwala na bezkonfliktowe i dobrze typowane wstrzykiwanie dowolnych wartości i usług.