Kako implementirati ubrizgavanje ovisnosti u AngularJs



Ova će vam artile pružiti detaljno i sveobuhvatno znanje o tome kako implementirati ubrizgavanje ovisnosti u AngularJs.

Injekcija ovisnosti je obrazac softverskog dizajna koji određuje način na koji komponente dohvaćaju svoje ovisnosti. Komponente dobivaju ovisnosti umjesto da ih teško kodiraju. Ponovna upotrebljivost i održivost mogu se postići upotrebom injekcije ovisnosti. Injekcija vrhovne ovisnosti u to mogu učiniti sljedeće komponente:





Injekcija ovisnosti vrijednosti

Jednostavni objekt u AngularJs poznat je kao vrijednost. To može biti niz, broj ili čak JavaScript objekt. Može se koristiti za prosljeđivanje vrijednosti u tvornicama, uslugama ili kontrolerima tijekom faze pokretanja i konfiguracije.

Primjer:



// definiranje modula

var firstModule = angular.module ('firstModule', [])

// stvoriti objekt vrijednosti i proslijediti mu podatke



firstModule.value ('numberValue', 50)

firstModule.value ('stringValue', 'xyz')

firstModule.value ('objectValue', {val1: 456, val2: 'xyz'})

U ovom primjeru vrijednosti se definiraju pomoću funkcije value (). Ime vrijednosti navodi prvi parametar, a drugi parametar vrijednost. To omogućuje tvornicama, uslugama i kontrolorima da se same imenuju tim vrijednostima.

Ubrizgavanje vrijednosti

Vrijednost možemo ubrizgati u funkciju regulatora AngularJs dodavanjem parametra s istim imenom kao vrijednost.

Primjer:

var firstModule = angular.module ('firstModule', [])

firstModule.value ('numberValue', 18)

firstModule.controller ('FirstController', funkcija ($ opseg, brojValue) {

console.log (numberValue)

})

Tvornička injekcija

Funkcija koja stvara vrijednosti poznata je kao tvornica. Vrijednost na zahtjev stvara tvornica, kad god usluzi ili upravljaču treba vrijednost ubrizgana iz tvornice. Jednom kada se vrijednost stvori, ona se ponovno koristi za sve usluge i kontrolere.

Omogućuje upotrebu tvorničke funkcije za izračunavanje i vraćanje vrijednosti.

Primjer:

var firstModule = angular.module ('firstModule', [])

firstModule.factory ('firstFactory', function () {

vrati 'vrijednost'

})

firstModule.controller ('FirstController', funkcija ($ opseg, firstFactory) {

console.log (firstFactory)

})

Ubrizgavanje vrijednosti u tvornicu

Vrijednost se može ubrizgati u tvornicu sljedećom metodom:

var firstModule = angular.module ('firstModule', [])

firstModule.value ('numberValue', 29)

firstModule.controller ('FirstController', funkcija ($ opseg, brojValue) {

console.log (numberValue)

})

Mora se napomenuti da vrijednostproizvedena tvorničkom funkcijom ubrizgava se, a ne sama tvornička funkcija. Krenimo s ovim člankom ubrizgavanja ovisnosti u AngularJs.

Injekcija usluge u AngularJs

Jednokratni JavaScript objekt koji sadrži skup funkcija poznat je kao usluga u AngularJ-ovima. Logika potrebna za obavljanje usluge sadržana je u funkciji. Usluga se može stvoriti upotrebom funkcije service () na modulu.

Primjer:

// definiranje modula

var firstApp = angular.module ('firstApp', [])

...

// stvorimo uslugu koja definira metodu kvadrat za vraćanje kvadrata broja

firstApp.service ('CalciService', funkcija (MathService) {

this.square = funkcija (x) {

vrati MathService.multiply (x, x)

}

})

// ubrizgamo uslugu 'CalciService' u kontroler

firstApp.controller ('CalciController', funkcija ($ opseg, CalciService,

defaultInput) {

$ scope.number = defaultInput

$ scope.result = CalciService.square ($ scope.number)

$ scope.square = function () {

$ scope.result = CalciService.square ($ scope.number)

}

})

Pružatelj usluga

Za interno stvaranje usluga ili tvornica tijekom faze konfiguriranja koristimo dobavljača. Pružatelj je posebna tvornička metoda s funkcijom get () koja se koristi za vraćanje vrijednosti / usluge / tvornice.

Primjer:

// definiranje modula

var firstApp = angular.module ('firstApp', [])

...

// stvorimo uslugu pomoću davatelja koji definira kvadrat metode za vraćanje

kvadrat broja.

firstApp.config (funkcija ($ osigurati) {

$ provide.provider ('MathService', function () {

ovo. $ get = function () {

tvornica var =

tvornički.množiti = funkcija (x, y) {

povrat x * y

}

povratak tvornica

}

})

})

Konstantno

Budući da korisnik ne može ubrizgati vrijednosti u funkciju module.config (), koristimo konstante. Konstante se koriste za prosljeđivanje vrijednosti u fazi konfiguracije.

firstApp.constant (“configParam”, “konstantna vrijednost”)

Primjer:

Gore navedene smjernice mogu se koristiti na sljedeći način:

Injekcija ovisnosti

Primjer kvadratnog JS-a

Unesite bilo koji broj:

x2

Rezultat: {{rezultat}}

kako postaviti java put -

var firstApp = angular.module ('firstApp', [])

firstApp.config (funkcija ($ osigurati) {

$ provide.provider ('MathService', function () {

ovo. $ get = function () {

tvornica var =

tvornički.množiti = funkcija (x, y) {

povrat x * y

}

povratak tvornica

}

})

})

firstApp.value ('defaultInput', 6)

firstApp.factory ('MathService', function () {

tvornica var =

tvornički.množiti = funkcija (x, y) {

povrat x * y

}

povratak tvornica

})

firstApp.service ('CalciService', funkcija (MathService) {

this.square = funkcija (x) {

vrati MathService.multiply (x, x)

}

})

firstApp.controller ('CalciController', funkcija ($ opseg, CalciService, defaultInput) {

$ scope.number = defaultInput

$ scope.result = CalciService.square ($ scope.number)

$ scope.square = function () {

$ scope.result = CalciService.square ($ scope.number)

}

})

IZLAZ:

ubrizgavanje ovisnosti u angularjs

Ovime smo došli do kraja ovog članka Injection Dependency Injection u AngularJs. C pakao Edureka, pouzdane tvrtke za internetsko učenje s mrežom od više od 250 000 zadovoljnih učenika raširenih širom svijeta.

Imate pitanje za nas? Molimo vas da ga spominjete u odjeljku za komentare ovog ubrizgavanja ovisnosti u AngularJs, a mi ćemo vam se javiti.