Angular Academy · Lektion

Injektionssymboler

Injicera värden som inte är klasser med tokens.

Lektion 4 av 413 steg

Injektionssymboler är en gratis lektion i Angular Academy på CoddyKit. Detta är lektion 4 av 4. Du kan läsa vilka 3 lektioner som helst i den här lärvägen kostnadsfritt i sin helhet – därefter låser CoddyKit PRO upp alla lektioner, plus praktisk övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Den ingår i lärvägen för Angular Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i Angular Academy innehåller totalt 4 lektioner.

Injection tokens

Alla beroenden är inte klasser. För att injicera värden som konfigurationsobjekt, strängar eller gränssnitt använder ni en InjectionToken som unik nyckel.

Varför tokens

Klasser kan användas direkt som DI-nycklar, men gränssnitt och primitiva värden kan inte det (gränssnitt försvinner vid körning). En InjectionToken tillhandahåller en stabil, typad nyckel för dessa fall.

Skapa en token

Skapa en token med new InjectionToken<T> och skicka med en beskrivning som är begriplig för människor.

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

export const API_URL = new InjectionToken<string>('API_URL');

Typparametern

Den generiska typparametern (här string) ger token en typ, så att injicerade värden får rätt typ.

Tillhandahålla ett tokenvärde

Registrera token med ett värde genom att använda useValue i en providers-array.

// bootstrapApplication(AppComponent, {
//   providers: [{ provide: API_URL, useValue: 'https://api.example.com' }]
// });

Injicera en token

Injicera token med inject-funktionen för att hämta dess värde.

import { inject } from '@angular/core';
import { API_URL } from './tokens';

export class Api {
  private baseUrl = inject(API_URL);
}

Tokens för konfiguration

Ett vanligt användningsområde är appkonfiguration: definiera ett gränssnitt, skapa en token med den typen och tillhandahåll ett konfigurationsobjekt.

export interface AppConfig { title: string; retries: number; }
export const APP_CONFIG = new InjectionToken<AppConfig>('APP_CONFIG');

Tillhandahålla konfigurationen

Tillhandahåll sedan konfigurationsvärdet vid bootstrap.

// providers: [{ provide: APP_CONFIG, useValue: { title: 'My App', retries: 3 } }]

Standardvärden från en factory

En token kan ange ett standardvärde via en factory i sina alternativ, så att den fungerar även utan en uttrycklig provider.

export const RETRIES = new InjectionToken<number>('RETRIES', {
  providedIn: 'root',
  factory: () => 3
});

Tokens kontra klasser

Använd en klass som nyckel när beroendet är en tjänsteklass. Använd en InjectionToken när ni injicerar värden som inte är klasser: konfigurationer, primitiva värden eller objekt som har en gränssnittstyp.

Undvika magiska strängar

InjectionTokens ersätter sköra strängnycklar med typade identifierare utan kollisioner och upptäcker misstag vid kompileringen.

Snabbkontroll: tokens

Injicera värden som inte är klasser.

Besvara frågan i den interaktiva lektionen

Sammanfattning: injection tokens

Ni har lärt er att InjectionToken tillhandahåller typade nycklar för att injicera värden som inte är klasser, till exempel konfigurationsobjekt, strängar och data med en gränssnittstyp. Skapa en med new InjectionToken, tillhandahåll den med useValue eller ett standardvärde från en factory och injicera den med inject(). Ni har slutfört kursen Dependency Injection.

Gratis att börja

Lär dig HTML med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser: 38
Lektioner: 144

Börja lära dig gratis Visa hela kursen

Vanliga frågor

Är lektionen ”Injektionssymboler” gratis?

Ja – du kan läsa vilka 3 lektioner som helst i lärvägen Angular Academy, inklusive ”Injektionssymboler”, kostnadsfritt i sin helhet här på webben. Därefter låser CoddyKit PRO upp alla lektioner, plus interaktiv övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Kursen i Angular Academy innehåller totalt 4 lektioner.

Vad lär jag mig i ”Injektionssymboler”?

Injicera värden som inte är klasser med tokens. Ni övar på Angular Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig Angular Academy?

Du behöver inga förkunskaper. Utbildningen i Angular Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 4 av 4.

Hur lång tid tar lektionen ”Injektionssymboler”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här Angular Academy-lektionen?

Ja. Varje Angular Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

← Tillbaka till Angular Academy