Dependency Injection er et mønster for programvaredesign som spesifiserer måten komponenter får tak i deres avhengighet. Komponentene får avhengighet i stedet for hardkoding. Gjenbrukbarhet og vedlikeholdsevne kan oppnås ved å bruke avhengighetsinjeksjon. Høyeste avhengighetsinjeksjon i kan gjøres av følgende komponenter:
Verdiavhengighetsinjeksjon
Et enkelt objekt i AngularJs er kjent som en verdi. Det kan være en streng, et tall eller til og med et JavaScript-objekt. Den kan brukes til å overføre verdier i fabrikker, tjenester eller kontrollere under kjørings- og konfigurasjonsfasen.
Eksempel:
// definere en modul
var firstModule = angular.module ('firstModule', [])
// lage et verdiobjekt og overføre data til det
firstModule.value ('numberValue', 50)
firstModule.value ('stringValue', 'xyz')
firstModule.value ('objectValue', {val1: 456, val2: 'xyz'})
I dette eksemplet defineres verdier ved hjelp av verdien () -funksjonen. Navnet på verdien angis av den første parameteren, og den andre parameteren angir verdien. Dette gjør at fabrikkene, tjenestene og kontrollerne kan referere til disse verdiene med navnet sitt.
Injisere en verdi
Vi kan injisere en verdi i AngularJs-kontrollerfunksjonen ved å legge til en parameter med samme navn som verdien.
Eksempel:
var firstModule = angular.module ('firstModule', [])
firstModule.value ('numberValue', 18)
firstModule.controller ('FirstController', funksjon ($ scope, numberValue) {
console.log (numberValue)
})
Fabrikkinjeksjon
En funksjon som skaper verdier er kjent som en fabrikk. En verdi på forespørsel opprettes av fabrikken når en tjeneste eller kontroller trenger en verdi som er injisert fra fabrikken. Når verdien er opprettet, blir den gjenbrukt for alle tjenester og kontrollere.
Det bruker fabrikkfunksjonen til å beregne og returnere verdien.
Eksempel:
var firstModule = angular.module ('firstModule', [])
firstModule.factory ('firstFactory', funksjon () {
returner 'en verdi'
})
firstModule.controller ('FirstController', funksjon ($ scope, firstFactory) {
console.log (firstFactory)
})
Injisere verdier i fabrikken
En verdi kan injiseres i fabrikken etter følgende metode:
var firstModule = angular.module ('firstModule', [])
firstModule.value ('numberValue', 29)
firstModule.controller ('FirstController', funksjon ($ scope, numberValue) {
sum av sifre i java
console.log (numberValue)
})
Det må bemerkes at verdienprodusert av fabrikkfunksjonen injiseres, ikke selve fabrikkfunksjonen. La oss gå videre med denne artikkelen om Dependency Injection in AngularJs.
Serviceinjeksjon i AngularJs
Et enkelt JavaScript-objekt som inneholder et sett med funksjoner, er kjent som en tjeneste i AngularJs. Logikken som er nødvendig for at tjenesten skal utføres, er inneholdt i funksjonen. Tjeneste kan opprettes ved å bruke tjenesten () -funksjonen på en modul.
Eksempel:
// definere en modul
var firstApp = angular.module ('firstApp', [])
...
// lage en tjeneste som definerer en metode kvadrat for å returnere kvadratet til et tall
firstApp.service ('CalciService', funksjon (MathService) {
this.square = funksjon (x) {
returner MathService.multiply (x, x)
}
})
// injiser tjenesten 'CalciService' i kontrolleren
firstApp.controller ('CalciController', funksjon ($ scope, CalciService,
defaultInput) {
$ scope.number = defaultInput
$ scope.result = CalciService.square ($ scope.number)
$ scope.square = funksjon () {
$ scope.result = CalciService.square ($ scope.number)
}
})
Forsørger
For å opprette tjenester eller fabrikker internt i konfigurasjonsfasen, bruker vi leverandøren. Leverandør er en spesiell fabrikkmetode med en get () -funksjon som brukes til å returnere verdien / tjenesten / fabrikken.
Eksempel:
// definere en modul
var firstApp = angular.module ('firstApp', [])
...
// opprette en tjeneste ved hjelp av leverandør som definerer et metodefelt for å returnere
kvadrat av et tall.
firstApp.config (funksjon ($ gi) {
$ provide.provider ('MathService', funksjon () {
dette. $ get = funksjon () {
var fabrikk =
factory.multiply = funksjon (x, y) {
returner x * y
}
returfabrikk
}
})
})
hvordan snu en strengpyton
Konstant
Siden brukeren ikke kan injisere verdier i module.config () -funksjonen, bruker vi konstanter. Konstanter brukes til å overføre verdier i konfigurasjonsfasen.
firstApp.constant (“configParam”, “konstant verdi”)
Eksempel:
Direktivene nevnt ovenfor kan brukes på følgende måte:
Avhengighetsinjeksjon
AngularJS kvadrateksempel
Skriv inn et hvilket som helst nummer:
X2
Resultat: {{result}}
var firstApp = angular.module ('firstApp', [])
firstApp.config (funksjon ($ gi) {
$ provide.provider ('MathService', funksjon () {
dette. $ get = funksjon () {
var fabrikk =
factory.multiply = funksjon (x, y) {
returner x * y
}
returfabrikk
}
})
})
firstApp.value ('defaultInput', 6)
firstApp.factory ('MathService', funksjon () {
var fabrikk =
factory.multiply = funksjon (x, y) {
returner x * y
}
returfabrikk
})
firstApp.service ('CalciService', funksjon (MathService) {
this.square = funksjon (x) {
returner MathService.multiply (x, x)
}
})
firstApp.controller ('CalciController', funksjon ($ scope, CalciService, defaultInput) {
$ scope.number = defaultInput
$ scope.result = CalciService.square ($ scope.number)
$ scope.square = funksjon () {
$ scope.result = CalciService.square ($ scope.number)
}
})
PRODUKSJON:
Med dette kommer vi til en slutt på denne avhengighetsinjeksjonen i AngularJs-artikkelen. C pokker ut av Edureka, et pålitelig online læringsfirma med et nettverk av mer enn 250 000 fornøyde elever spredt over hele verden.
Har du et spørsmål til oss? Vennligst nevn det i kommentarfeltet til denne avhengighetsinjeksjonen i AngularJs, så kommer vi tilbake til deg.