Dependency Injection is een softwareontwerppatroon dat de manier specificeert waarop componenten hun afhankelijkheden in handen krijgen. De componenten krijgen hun afhankelijkheden in plaats van ze hard te coderen. Herbruikbaarheid en onderhoudbaarheid kunnen worden bereikt door gebruik te maken van afhankelijkheidsinjectie. Supreme Dependency Injection in kan worden gedaan door de volgende componenten:
Waarde afhankelijkheidsinjectie
Een eenvoudig object in AngularJs staat bekend als een waarde. Het kan een tekenreeks, een getal of zelfs een JavaScript-object zijn. Het kan worden gebruikt om waarden door te geven in fabrieken, services of controllers tijdens de run- en configuratiefase.
Voorbeeld:
// definieer een module
var firstModule = angular.module ('firstModule', [])
// maak een waardeobject en geef er gegevens aan door
firstModule.value ('numberValue', 50)
firstModule.value ('stringValue', 'xyz')
firstModule.value ('objectValue', {val1: 456, val2: 'xyz'})
In dit voorbeeld worden waarden gedefinieerd met de functie value (). De naam van de waarde wordt gespecificeerd door de eerste parameter, en de tweede parameter specificeert de waarde. Dit stelt de fabrieken, diensten en controllers in staat om deze waarden bij hun naam zelf te noemen.
Een waarde toevoegen
We kunnen een waarde in de AngularJs-controllerfunctie injecteren door een parameter toe te voegen met dezelfde naam als de waarde.
Voorbeeld:
var firstModule = angular.module ('firstModule', [])
firstModule.value ('numberValue', 18)
firstModule.controller ('FirstController', functie ($ scope, numberValue) {
console.log (numberValue)
})
Fabrieksinjectie
Een functie die waarden creëert, staat bekend als een fabriek. Een waarde op aanvraag wordt gecreëerd door de fabriek, wanneer een service of controller een waarde nodig heeft die vanuit de fabriek wordt geïnjecteerd. Zodra de waarde is gecreëerd, wordt deze hergebruikt voor alle services en controllers.
Het maakt gebruik van de fabrieksfunctie om de waarde te berekenen en te retourneren.
__init__ in python
Voorbeeld:
var firstModule = angular.module ('firstModule', [])
firstModule.factory ('firstFactory', function () {
retourneer 'een waarde'
})
firstModule.controller ('FirstController', functie ($ scope, firstFactory) {
console.log (firstFactory)
})
Waarden in de fabriek injecteren
Een waarde kan op de volgende manier in de fabriek worden geïnjecteerd:
var firstModule = angular.module ('firstModule', [])
firstModule.value ('numberValue', 29)
firstModule.controller ('FirstController', functie ($ scope, numberValue) {
console.log (numberValue)
})
Opgemerkt moet worden dat de waardegeproduceerd door de fabrieksfunctie wordt geïnjecteerd, niet de fabrieksfunctie zelf. Laten we verder gaan met dit artikel van Dependency Injection in AngularJs.
Service-injectie in AngularJs
Een singleton JavaScript-object dat een set functies bevat, wordt in AngularJs een service genoemd. De logica die nodig is om de service uit te voeren, is vervat in de functie. Service kan worden gemaakt door de functie service () op een module te gebruiken.
Voorbeeld:
// definieer een module
var firstApp = angular.module ('firstApp', [])
...
// maak een service die een methode definieert vierkant om het kwadraat van een getal terug te geven
firstApp.service ('CalciService', functie (MathService) {
this.square = functie (x) {
retourneer MathService.multiply (x, x)
}
})
beëindig een programma in java
// injecteer de service 'CalciService' in de controller
firstApp.controller ('CalciController', functie ($ scope, CalciService,
defaultInput) {
$ scope.number = defaultInput
$ scope.result = CalciService.square ($ scope.number)
$ scope.square = functie () {
$ scope.result = CalciService.square ($ scope.number)
}
})
Aanbieder
Om tijdens de configuratiefase intern services of factory te creëren, maken we gebruik van Provider. Provider is een speciale fabrieksmethode met een functie get () die wordt gebruikt om de waarde / service / fabriek te retourneren.
Voorbeeld:
// definieer een module
var firstApp = angular.module ('firstApp', [])
...
// maak een service met behulp van een provider die een methodevierkant definieert om de
vierkant van een getal.
firstApp.config (functie ($ bieden) {
$ offer.provider ('MathService', function () {
this. $ get = function () {
var fabriek =
factory.multiply = functie (x, y) {
retourneer x * y
}
terugkeer fabriek
}
})
})
Constante
Omdat de gebruiker geen waarden kan injecteren in de functie module.config (), maken we gebruik van constanten. Constanten worden gebruikt om waarden door te geven in de configuratiefase.
firstApp.constant ('configParam', 'constante waarde')
Voorbeeld:
Bovenstaande richtlijnen kunnen op de volgende manier worden gebruikt:
Afhankelijkheidsinjectie
AngularJS Squaring Voorbeeld
Voer een willekeurig nummer in:
X2
Resultaat: {{resultaat}}
var firstApp = angular.module ('firstApp', [])
firstApp.config (functie ($ bieden) {
$ offer.provider ('MathService', function () {
this. $ get = function () {
var fabriek =
factory.multiply = functie (x, y) {
retourneer x * y
}
terugkeer fabriek
}
})
})
firstApp.value ('defaultInput', 6)
firstApp.factory ('MathService', function () {
var fabriek =
factory.multiply = functie (x, y) {
retourneer x * y
}
terugkeer fabriek
})
firstApp.service ('CalciService', functie (MathService) {
this.square = functie (x) {
retourneer MathService.multiply (x, x)
}
})
c ++ fibonacci-reeks
firstApp.controller ('CalciController', functie ($ scope, CalciService, defaultInput) {
$ scope.number = defaultInput
$ scope.result = CalciService.square ($ scope.number)
$ scope.square = functie () {
$ scope.result = CalciService.square ($ scope.number)
}
})
UITGANG:
Hiermee komen we aan het einde van dit Dependency Injection in AngularJs-artikel. C ach uit de door Edureka, een vertrouwd online leerbedrijf met een netwerk van meer dan 250.000 tevreden leerlingen verspreid over de hele wereld.
Heeft u een vraag voor ons? Vermeld het in het opmerkingengedeelte van deze afhankelijkheidsinjectie in AngularJs en we nemen contact met u op.