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 Grundkurs

Einen Scope generieren und nutzen

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Wann, wie und unter welchen Voraussetzungen AngularJS automatisch einen Gültigkeitsbereich, den Scope, generiert – und wozu dieser dient – ist Thema dieses kurzen Überblicks.
04:26

Transkript

Gültigkeitsbereiche spielen an AngularJS eine ganz bedeutende Rolle. In AngularJS nennt man diese Bereiche auch Scope. Das heißt, ein Scope ist ein Objekt, also ein Bereich, eine Blackbox, ein abgeschlossenes System, das von AngularJS dafür verwendet wird, um Austausch zwischen Controller und View und anderen HTML-Elementen und übergeordneten Elementen durchführen zu können. Das heißt, so ein Gültigkeitsbereich wird automatisch generiert von AngularJS. Wann wird dieser Gültigkeitsbereich definiert? Der Gültigkeitsbereich wird immer dann definiert, wenn zum Beispiel ein Controller im Spiel ist. Wenn wir hier einfach schauen, habe ich an dieser Stelle einen Controller an einen Div-Knoten drangehängt und ab diesem Moment seht Ihr, dass dann entsprechend AngularJS automatisch hingeht und dann mit der Klasse ng-scope dementsprechend dann signalisiert, dieses HTML-Element besitzt einen eigenen Bereich, einen Scope, einen Gültigkeitsbereich und in diesem Bereich kann ich dann entsprechend Variablen und Methoden hinterlegen, die mir dann erlauben, dass ich dann direkt über dieses HTML-Element entsprechend auf dieses Objekt, also auf diesen Bereiche zugreifen kann und dementsprechend auf die Eigenschafen und Methoden, die in diesem Bereich definiert wurden. Das heißt, dieser Scope ist ein Objekt und in diesem Objekt definiere ich Eigenschaften und Methoden und diese Eigenschaften und Methoden kann ich ab dann mit diesem HTML-Element ohne weiteres entweder durch Bindungen oder durch direkte Ansprachen dann angehen und entsprechend kommunizieren mit diesem Bereich. Das Tolle an der ganzen Sache ist, dass wenn dann ineinander verschachtelte Controller sind, bedeutet nichts anderes als, wenn quasi in diesem Div-Knoten, den ich jetzt hier habe, ein zweiter Knoten wäre und ich hätte dann entsprechend eine Verschachtelung. Dann hätte ich quasi einen Scope innerhalb eines Scopes. Das heißt, hier wird ein Scope produziert und übergeordnet das Elternelement hätte auch ein Scope. Das Tolle bei AngularJS ist, dass es hierarchisch ist. Das heißt, ich wäre in der Lage, von diesem Bereich auf das Elternbereich zurückzugreifen und auf dessen Eigenschaften und Variablen zuzugreifen und dann entsprechend auch die Methoden dieses Bereiches zu triggern, auszulösen und dementsprechend Interaktion zu machen. Auf dieser Basis haben ich quasi eine kleine Blackbox in AngularJS, die es mir tatsächlich ermöglicht, sehr diffizil mit der Umwelt zu kommunizieren. Aufpassen muss ich nur, wenn die Umwelt mit diesem Objekt kommuniziert. Das heißt, wenn ich beispielsweise mit jQuery oder von irgendwo anders das nicht AngularJS spezifisch ist, mit diesem Scope kommunizieren würde mit diesem Bereich, mit diesem Gültigkeitsbereich kommunizieren würde und ich würde beispielsweise Werte ändern, dann ist das nicht im Kontext von AngularJS passiert, also muss ich dafür sorgen, AngularJS dann Bescheid zu geben, dass es darauf reagieren muss, dass von außen eine Änderung stattgefunden hat. Ansonsten kann ich aber mit diesem Bereich fast alles machen. Ich kann, um es noch einmal zu wiederholen, Eigenschaften definieren. Ich kann Methoden definieren. Ich bin in der Lage ohne weiteres hierarchisch darauf zuzugreifen. Ich darf beispielsweise hierarchisch soweit zugreifen bis ich zu einem Root Objekt komme. Dieses Root Scope, dieses Root Objekt, diese Wurzel ist quasi der Gültigkeitsbereich der gesamten Applikation und selbst darauf kann ich dann zum Beispiel globale Eigenschaften und Methoden definieren um damit zu kommunizieren. Weiter ermöglicht es mir dieses Scope einen eigenen Nachrichtenbus zu verwenden. Ich bin also in der Lage Nachrichten an Eltern und Kind-Elemente zu definieren und damit auch ganz besonders toll dann quasi eine Abhängigkeit zu definieren. Wunderbar ist das Ganze auch, dass sich innerhalb dieser Gültigkeiten ich auch bestimmte Werte beobachten kann. Also ich habe so eine Art Observer Prinzip, ein Beobachterprinzip, womit ich mittels watch einfach schauen kann, haben sich hier bestimmte Eigenschaften geändert um damit dann entsprechend weiterarbeiten zu können. Alles in allem seht Ihr, dass dieser Gültigkeitsbereich wirklich unheimlich viel Potentiale bieten, um entsprechend dann arbeiten zu können und auch natürlich sehr effizient arbeiten zu können. In dem kommenden Kapitel möchte ich Euch all dies dann einmal demonstrieren.

AngularJS Grundkurs

Arbeiten Sie sich in AngularJS, einem JavaScript-Framework von Google, ein und sehen Sie, wie Sie mit MVC-Design-Pattern und Dependency Injection im HTML-Umfeld arbeiten können.

3 Std. 43 min (44 Videos)
Derzeit sind keine Feedbacks vorhanden...
 
Hersteller:
Software:
Exklusiv für Abo-Kunden
Ihr(e) Trainer:
Erscheinungsdatum:27.06.2013
Laufzeit:3 Std. 43 min (44 Videos)

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!