AngularJS Geltungsbereich (Scope)
Scope (Scope) in der Link HTML (View) und JavaScript (Controller) verwendet, um zwischen.
Scope ist ein Ziel, Methoden und Eigenschaften zur Verfügung stehen.
Scope kann in der Ansicht und Controller verwendet werden.
How to use Scope
Wenn Sie Controller AngularJS erstellt haben , können Sie denGültigkeitsbereich Objekt als Argument $:
AngularJS Beispiele
Controller-Attribute entsprechend den Attributen sehen auf:
<H1> {{carname}} </ h1>
</ Div>
<Script>
app.controller ( 'myCtrl', function ( $ scope) {
$ Scope.carname = "Volvo";
});
Versuchen »
Beim Hinzufügen vonRahmen $ in die Controller - Objekte kann die Ansicht (HTML) , um diese Eigenschaften zu bekommen.
Ansicht, brauchen Sie nicht zu$ scope Präfix hinzufügen möchten , müssen Sie nur einen Attributnamen, wie hinzuzufügen:{{carname}}.
Scope Übersicht
AngularJS Anwendung besteht aus folgenden Komponenten:
- Ansicht (Ansicht), dh HTML.
- Model (Modell), die aktuelle Ansicht der verfügbaren Daten.
- Controller (Controller), die JavaScript-Funktion, können Sie hinzufügen oder Eigenschaften ändern.
Umfang das Modell.
Scope ist ein JavaScript-Objekt-Eigenschaften und Methoden mit diesen Attributen und Methoden können in Ansichten und Controller verwendet werden.
AngularJS Beispiele
Wenn Sie die Ansicht, Modell ändern und Controller werden aktualisiert:
<Input ng-Modell = "name ">
<H1> Mein Name ist {{name}} </ h1 >
</ Div>
<Script>
app.controller ( 'myCtrl', function ( $ scope) {
$ Scope.name = "John Dow";
});
Versuchen »
Anwendungsbereich Anwendungsbereich
Verstehen Sie den Bereich, den Sie derzeit verwenden ist sehr wichtig.
In beiden Fällen gibt Umfang nur ein Bereich ist, so dass der Prozess ist relativ einfach, aber in großen Projekten, hat HTML-DOM mehrere Bereiche, dann müssen Sie den Umfang der entsprechenden Umfang zu wissen, ist, was Sie verwenden a.
AngularJS Beispiele
Wenn wirng-Repeat - Befehl zu verwenden, haben jedes Duplikat des aktuellen doppeltes Objekt besucht:
<Ul>
<Li ng-repeat = "x in Namen"> {{x}} </ li>
</ Ul>
</ Div>
<Script>
app.controller ( 'myCtrl', function ( $ scope) {
$ Scope.names = [ "Emil", "Tobias", "Linus"];
});
Versuchen »
Jedes<li> -Element die aktuellen doppelten Objekte zugreifen können, ist hier eine entsprechende Zeichenfolge, und Variable xangibt.
Stammbereich
Alle Anwendungen haben ein$ rootScope, es für alle HTML - Elemente ng-App- Direktive enthält angewendet wird.
$ RootScope kann auf die gesamte Anwendung handeln.Jeder Controller ist im Bereich der Brücke. Rootscope mit dem Wert in jedem Controller definiert können in eingesetzt werden.
AngularJS Beispiele
Wenn Sie erstellen einen Controller zu $ rootScope geben als Parameter in der Anwendung verwendet werden können:
<H1> {{Name}} Familienmitglieder: </ h1>
<Ul>
<Li ng-repeat = "x in Namen"> {{x}} {{name}} </ li>
</ Ul>
</ Div>
<Script>
app.controller ( 'myCtrl', function ( $ scope, $ rootScope) {
$ Scope.names = [ "Emil", "Tobias", "Linus"];
$ RootScope.lastname = "Refsnes";
});
Versuchen »