A Dependency Injection egy szoftvertervezési minta, amely meghatározza, hogy az összetevők hogyan tudják megszerezni függőségüket. Az összetevők megkapják a függőségüket ahelyett, hogy keményen kódolnák őket. Az újrafelhasználhatóság és a karbantarthatóság függőségi injekcióval érhető el. Legfelsőbb függőségi injekció a következő komponensekkel végezhető el:
- Értékfüggőség befecskendezése
- Gyári befecskendezés
- Szolgáltatás befecskendezése szögletes J-kben
- Szolgáltató
- Állandó
Értékfüggőség befecskendezése
Az AngularJs egyszerű objektumát értékként ismerjük. Ez lehet karakterlánc, szám vagy akár JavaScript objektum. Használható gyárak, szolgáltatások vagy vezérlők értékeinek átadására a futtatás és a konfigurálás szakaszában.
Példa:
// modul meghatározása
var firstModule = szögletes.module ('firstModule', [])
// létrehoz egy értékobjektumot, és adatokat továbbít neki
firstModule.value ('numberValue', 50)
firstModule.value ('stringValue', 'xyz')
firstModule.value ('objectValue', {val1: 456, val2: 'xyz'})
Ebben a példában az értékeket az érték () függvény segítségével határozzuk meg. Az érték nevét az első paraméter, a második paraméter pedig az értéket adja meg. Ez lehetővé teszi a gyárak, szolgáltatások és vezérlők számára, hogy maguk a nevük alapján hivatkozhassanak ezekre az értékekre.
Érték beadása
Input beírhatunk egy értéket az AngularJs vezérlő funkcióba úgy, hogy hozzáadunk egy, az értékkel megegyező nevű paramétert.
Példa:
var firstModule = szögletes.module ('firstModule', [])
firstModule.value ('numberValue', 18)
firstModule.controller ('FirstController', function ($ hatókör, numberValue) {
console.log (numberValue)
})
Gyári befecskendezés
Az értékeket létrehozó függvény gyár néven ismert. Igény szerint értéket a gyár hoz létre, amikor egy szolgáltatásnak vagy vezérlőnek szüksége van egy gyárilag beadott értékre. Az érték létrehozása után az újból felhasználásra kerül az összes szolgáltatás és vezérlő számára.
A gyári függvényt használja az érték kiszámításához és visszaadásához.
Példa:
var firstModule = szögletes.module ('firstModule', [])
firstModule.factory ('firstFactory', function () {
visszatér egy „érték”
})
firstModule.controller ('FirstController', function ($ hatókör, firstFactory) {
console.log (firstFactory)
})
Értékek beadása a gyárba
Egy értéket a következő módszerrel lehet a gyárba injektálni:
var firstModule = szögletes.module ('firstModule', [])
firstModule.value ('numberValue', 29)
firstModule.controller ('FirstController', function ($ hatókör, numberValue) {
console.log (numberValue)
})
Meg kell jegyezni, hogy az értéka gyári funkció által előállított injekció kerül beadásra, nem maga a gyári funkció. Folytassuk ezt a cikket a Dependency Injection in AngularJs-ben.
Szolgáltatás befecskendezése szögletes J-kben
A szingulett JavaScript objektum, amely egy sor funkciót tartalmaz, az AngularJs szolgáltatásként ismert. A szolgáltatás végrehajtásához szükséges logikát a függvény tartalmazza. A szolgáltatás a modul service () függvényével hozható létre.
Példa:
// modul meghatározása
var firstApp = szögletes modul ('firstApp', [])
...
// létrehoz egy szolgáltatást, amely meghatároz egy módszert négyzet, hogy visszatérjen egy szám négyzetéhez
firstApp.service ('CalciService', függvény (MathService) {
this.négyzet = függvény (x) {
return MathService.multiply (x, x)
}
})
// injektálja a 'CalciService' szolgáltatást a vezérlőbe
firstApp.controller ('CalciController', function ($ hatókör, CalciService,
defaultInput) {
hogyan lehet konvertálni a stringet dátumra a java-ban
$ scope.number = defaultInput
$ scope.result = CalciService.square ($ scope.number)
$ scope.square = function () {
$ scope.result = CalciService.square ($ scope.number)
}
})
Szolgáltató
Szolgáltatások vagy gyár belső létrehozásához a konfigurációs szakaszban a Szolgáltatót vesszük igénybe. A Provider egy speciális gyári módszer get () függvénnyel, amelyet az érték / szolgáltatás / gyár visszaadására használnak.
Példa:
// modul meghatározása
var firstApp = szögletes modul ('firstApp', [])
...
// létrehozni egy szolgáltatót használó szolgáltatást, amely meghatározza a metódus négyzetét a
szám négyzete.
firstApp.config (function ($ biztosítja) {
$ provide.provider ('MathService', function () {
ez. $ get = function () {
var gyár =
gyár.többször = függvény (x, y) {
vissza x * y
}
visszatérő gyár
}
})
})
Állandó
Mivel a felhasználó nem adhat be értékeket a module.config () függvénybe, használunk konstansokat. Az állandókat az értékek átadására használják a konfigurációs szakaszban.
firstApp.constant („configParam”, „állandó érték”)
Példa:
A fent említett irányelveket a következőképpen lehet felhasználni:
Függőségi injekció
php print_r tömb
AngularJS négyzet példa
Írjon be bármilyen számot:
x2
Eredmény: {{eredmény}}
var firstApp = szögletes modul ('firstApp', [])
firstApp.config (function ($ biztosítja) {
$ provide.provider ('MathService', function () {
ez. $ get = function () {
var gyár =
gyár.többször = függvény (x, y) {
vissza x * y
}
visszatérő gyár
}
})
})
firstApp.value ('defaultInput', 6)
firstApp.factory ('MathService', function () {
var gyár =
gyár.többször = függvény (x, y) {
vissza x * y
}
visszatérő gyár
})
firstApp.service ('CalciService', függvény (MathService) {
this.négyzet = függvény (x) {
return MathService.multiply (x, x)
}
})
firstApp.controller ('CalciController', function ($ hatókör, CalciService, defaultInput) {
$ scope.number = defaultInput
$ scope.result = CalciService.square ($ scope.number)
$ scope.square = function () {
$ scope.result = CalciService.square ($ scope.number)
}
})
KIMENET:
Ezzel véget értünk ennek a függőségi injekciónak az AngularJs cikkében. C a fenébe az Edureka, egy megbízható online tanulási vállalat, amelynek több mint 250 000 elégedett tanulóval rendelkező hálózata elterjedt az egész világon.
Van egy kérdésünk? Kérjük, említse meg ennek a függőségi injekciónak az AngularJs megjegyzéseiben, és kapcsolatba lépünk Önnel.