Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

AngularJS 1.3 Grundkurs

AngularJS Services

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Services stellen in AngularJS eine weitere Variante dar, um Business-Logiken einzubinden. Diese benötigen keine Verknüpfung mit einem View-Element.
04:35

Transkript

Im Kontext von AngularJS gibt es unterschiedliche Möglichkeiten, wie ich Businesslogiken einbinden kann. Im generellen Fall ist es so, dass ich ein View-Element habe und in diesem View-Element bin ich dann in der Lage, zunächst einmal ein Applikationsmodul zu initialisieren mit ng-app und anschließend dann ein Controller explizit an eine View dranzuhängen. Dabei wird der Controller in dem eigentlichen Applikationsmodul dann definiert, mit der Methode Controller und ist dann anschließend mit dem Scope perfekt über eine Brücke zwischen View und Logik dann verbunden. Es gibt aber auch tatsächlich Möglichkeiten, dass ich auf Logiken zurückgreifen kann, die nicht in Kombination mit einer View verbunden sein müssen. Diese Logiken nennt man dann Sservices. In diesem simplen Beispiel bin ich hingegangen und habe für mein Service ein komplett eignes Modul erstellt. Das mache ich über die Methode angular.module und nenne das Modul app.service. Dieses app.service- Modul habe ich dann in meiner eigentlichen Applikation registriert und bin dann anschließend in der Lage, einen eigenen Service, in diesem Falle mit der Methode .factory zu definieren. Der Service hier nennt sich ValDefinder und diesen kann ich dann, nachdem dann hier die entsprechende Verknüpfung durchgeführt habe, als Dependency Injection hervorragend in den jeweiligen Funktionen, wo ich sie benötige, verwenden. Das bedeutet also im Klartext, dass der Service selbst eine Businesslogik ist, die wirklich komplett losgelöst ist von der View und der Controller hingegen immer mit einer View gebunden ist. Schauen wir uns das Ganze mal innerhalb eines HTML-Kontextes an, dann sehen wir jetzt hier wunderbar, dass ich im Grunde genommen die beiden Module erzeugt habe. Ich habe das Modul app erzeugt, das Modul app.service, ich habe den ValDefinder erzeugt, app.service habe ich hier eingebunden, dass hier unten definiert ist und habe einen Service definiert: ValDefinder. Auf Details will ich hier gar nicht eingehen, sondern ich möcht einfach nur zeigen, dass der ValDefinder mit der .factory einfach eine factory-Methode hat, die mir in diesem Fall ein Objekt zurück gibt und diese Objekt beherbergt eine Funktion, die heißt defineValue, diese Funktion erwartet einen Wert, überprüft ob der Wert, der übergeben worden ist, auch tatsächlich definiert wurde, also ob kein undefined übergeben wurden ist und überprüft auch, ob der Wert eine Zahl ist. Sollte das der Fall sein, gehe ich dann entsprechend hin und gebe value einfach zurück. Sollte das nicht der Fall sein, definiere ich dann value neu, als den Standardwert, den ich in dem privaten Bereich hier definiert habe. Damit bin ich nun in der Lage, innerhalb meines Controllers etwas sehr simples zu machen. Ich kann nämlich den ValDefinder als Dependency Injection hier verwenden und bin dann anschließend in der Lage, die Methode, die ich hier definiert habe, in meinem Service, auch in dem Controller anzusprechen. Und der ValDefinder, der macht nichts anderes dann, als zu sagen, hey definier mir den Wert anhand des Ausgangspunktes p_foo und p_foo ist der Parameter, der durch die Methode .doReset übergeben werden muss und in diesem simplen Sample habe ich jetzt hier das .doReset an einem click-Handler drangebunden, denn der Controller, der hier definiert worden ist, ist ja entsprechend an das HTML-Element hier gebunden und '.doReset' wird aufgerufen über den Controller mit den Initialwerten sa und ba. Klicke ich da drauf, werde ich aber sehen, dass dann der Wert foo und bar trotzdem als defValue definiert wird, nämlich als den Wert Null. Das erkennen wir jetzt hier gleich innerhalb des HTML-Kontextes, wenn ich jetzt hier drauf klicke. Der Grund hierfür ist relativ einfach. Es wurde hier überprüft, ob es eine legitime Zahl ist, die übergeben worden ist. Wenn nicht, wurde auf den Standardwert zurück gesetzt. Hätte ich also hier stattdessen überhaupt keinen Wert angegeben, hätte es den gleichen Effekt gehabt oder wenn ich jetzt hier als Standardwerte 12 und 13 angeben würde, hätte dies zur Folge, dass ein Klick hier drauf die Werte 12 und 13 übergeben hätte. Und so bin ich in der Lage, Definitionen oder Werteänderungen in meinen externen Service zu packen. Das macht natürlich ausschließlich dann Sinn, bitte vergesst das nicht, wenn ihr diese Funktionalität immer wieder verwenden wollt. In meinen Projekten gibt es dementsprechend sehr häufig utils-Module. Und diese utils-Module haben unterschiedliche Helferlein drin, also sei es einfach nur bestimmte String-Operatoren durchzuführen oder sei es, bestimmte Bedingungen zu überprüfen. Und die kann ich dann aber auch in all meinen Projekten dann verwenden, indem ich hingehe und diese utils-Module einfach in mein Applikations-Modul und dann anschließend bei Dependency Injection einbinde. In diesem Video haben wir also gemeinsam gelernt, das Konzept der Services zu verstehen und welche Aufgaben die Services haben. Wir haben also einen sehr schönen Überblick bekommen, warum Services losgelöst sind vom eigentlichen use.

AngularJS 1.3 Grundkurs

Legen Sie mit AngularJS moderne, anspruchsvolle Webprojekte auf der Basis von HTML, CSS und JavaScript an.

4 Std. 15 min (74 Videos)
Derzeit sind keine Feedbacks vorhanden...
 
Hersteller:
Software:
AngularJS AngularJS 1.3
Exklusiv für Abo-Kunden
Erscheinungsdatum:19.11.2014

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!