în timp ce majoritatea dintre voi cel mai probabil familiarizați cu modul de bază pentru a configura un furnizor prin simpla declarare a acestora:

providers: 

Angular dependency injection oferă capabilități mai avansate.

cu furnizorul din fabrică puteți configuraInjector pentru a returna o valoare invocând o anumită funcție. Să ne uităm la acest exemplu.

providers: };

proprietatea provide configurează tokenul care va fi utilizat în injecția de dependență, iar useFactory indică funcția care va fi utilizată pentru a returna valoarea dorită. Proprietatea deps configurează jetoanele care vor fi transmise funcției dvs. din fabrică.

când să-l folosească?

furnizorul din fabrică poate fi foarte util atunci când trebuie să creați dinamic o valoare dependentă, pe baza informațiilor pe care nu le veți avea până la timpul de execuție. Puteți lua o decizie informată cu privire la ce valoare să returnați pe baza altor servicii și a stării aplicației.

exemplu:

să încercăm să ghicim de la ce dispozitiv mobil este conectat un utilizator. Vom încerca să folosim informații precum agentul utilizator al browserului, lățimea ecranului și înălțimea ecranului. Să definim trei token care va fi folosit mai târziu pentru a identifica numele dispozitivului.

InjectionTokenclasa — creează un simbol care poate fi utilizat în injecție dependență unghiulară. InjectionToken este parametrizat pe T care este tipul de obiect care va fi returnat de Injector. Acest lucru oferă un nivel suplimentar de siguranță de tip.

providers: providers: providers: 

acum putem veni cu un algoritm pentru a detecta numele dispozitivului pe baza celor trei jetoane pe care le-am definit mai sus. Trecem o funcție săgeată la useFactory care are 3 dependențe, pentru a rezolva aceste dependențe, trecem într-o matrice de dependență (dep) cu jetoanele listate.

providers: 

În cele din urmă, vom consuma numele dispozitivului în componenta noastră unghiulară.

@Component({ selector: 'my-device-name')
export class DeviceName {
constructor(@Inject('DeviceName') private deviceName: string) {}}

Decoratorul parametrului Inject indică Angular DI că acest parametru (deviceName) trebuie rezolvat dintr — un token definit-DeviceName.

asta e tot!

Urmați-mă pe Twitter # LanoTechno

Lasă un răspuns

Adresa ta de email nu va fi publicată.