Latest web development tutorials

AngularJS Scope (Ambito di applicazione)

Campo di applicazione (campo di applicazione) è usato nel link HTML (View) e JavaScript (controllore) tra.

Scope è un oggetto, metodi e proprietà sono disponibili.

Scope può essere utilizzato nella visualizzazione e controllo.

Come utilizzare Scope

Quando si crea AngularJS del controller, è possibile$ oggetto ambitocome argomento:

AngularJS esempi

Controllore attributi corrispondenti agli attributi View On:

<Div ng-app = "myApp " ng-controllore = "myCtrl">

<H1> {{carname}} </ h1>

</ Div>

<Script>
var app = angular.module ( 'myApp' , []);

app.controller ( 'myCtrl', function ( $ portata) {
$ Scope.carname = "Volvo";
});
</ Script>

Prova »

Quando si aggiungono$ portata oggetti nel controller, la vista (HTML) può ottenere queste proprietà.

Vista, non è necessario aggiungere il prefisso$ portata, è sufficiente aggiungere un nome di attributo, come ad esempio:{{}} carname.

Scope Panoramica

applicazione AngularJS è costituito dai seguenti:

  • View (vista), che è HTML.
  • Model (modello), la vista corrente dei dati disponibili.
  • Controller (Controller), la funzione JavaScript, è possibile aggiungere o modificare le proprietà.

ambito del modello.

ambito è un proprietà degli oggetti JavaScript e metodi con questi attributi e metodi possono essere usati nelle viste e controller.

AngularJS esempi

Se si modifica la visualizzazione, il modello e il controller verrà aggiornato:

<Div ng-app = "myApp " ng-controllore = "myCtrl">

<Ng-modello di input = "nome ">

<H1> Il mio nome è {{nome}} </ h1 >

</ Div>

<Script>
var app = angular.module ( 'myApp' , []);

app.controller ( 'myCtrl', function ( $ portata) {
$ Scope.name = "John Dow";
});
</ Script>

Prova »

ambito di applicazione Scope

Comprendere la portata che si sta utilizzando è molto importante.

In entrambi i casi, vi è un solo ambito di applicazione, in modo che il processo è relativamente semplice, ma in progetti di grandi dimensioni, HTML DOM ha più ambiti, allora avete bisogno di conoscere la portata del corrispondente campo di applicazione è quello che si usa a.

AngularJS esempi

Quando usiamo il comandong-repeat, hanno visitato ogni duplicato dell'oggetto duplicato corrente:

<Div ng-app = "myApp " ng-controllore = "myCtrl">

<Ul>
<Li ng-repeat = "x nei nomi"> {{x}} </ li>
</ Ul>

</ Div>

<Script>
var app = angular.module ( 'myApp' , []);

app.controller ( 'myCtrl', function ( $ portata) {
$ Scope.names = [ "Emil", "Tobias", "Linus"];
});
</ Script>

Prova »

Ogni<li> elemento può accedere agli oggetti duplicati in corso, qui è una stringa corrispondente, e la variabile xindica.

ambito Root

Tutte le applicazioni hanno un$ rootScope, si applica a tutti gli elementi HTML direttiva ng-appcontiene.

$ RootScope può agire sull'intera applicazione.Ogni controllore è nella portata del ponte. Rootscope con il valore definito in ogni controllore può essere utilizzato in.

AngularJS esempi

Quando si crea un controller a $ rootScope passato come parametro può essere utilizzato nell'applicazione:

<Div ng-app = "myApp " ng-controllore = "myCtrl">

<H1> {{LastName}} Familiari: </ h1>

<Ul>
<Li ng-repeat = "x nei nomi"> {{x}} {{cognome}} </ li>
</ Ul>

</ Div>

<Script>
var app = angular.module ( 'myApp' , []);

app.controller ( 'myCtrl', function ( $ portata, $ rootScope) {
$ Scope.names = [ "Emil", "Tobias", "Linus"];
$ RootScope.lastname = "Refsnes";
});
</ Script>

Prova »