Latest web development tutorials

AngularJS Scope (Champ d'application)

Champ d'application (champ d'application) est utilisé dans le lien HTML (Voir) et JavaScript (contrôleur) entre les deux.

Champ d'application est un objet, les méthodes et propriétés sont disponibles.

Champ d'application peut être utilisée dans la vue et le contrôleur.

Comment utiliser Scope

Lorsque vous créez AngularJS de contrôleur, vous pouvez$ objet champcomme argument:

AngularJS exemples

Controller attributs correspondant aux attributs Vue:

<Div ng-app = "myApp ng-contrôleur" = "myCtrl">

<H1> {{RARnom}} </ h1>

</ Div>

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

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

Essayez »

Lorsque vous ajoutez$ la portéedes objets dans le contrôleur, la vue (HTML) peut obtenir ces propriétés.

Voir, vous ne devez ajouter le préfixe$ de portée, il vous suffit d'ajouter un nom d'attribut, tel que:{{RARnom}}.

Portée Présentation

l'application AngularJS se compose des éléments suivants:

  • View (vue), qui est HTML.
  • Modèle (modèle), l'affichage actuel des données disponibles.
  • Controller (contrôleur), la fonction JavaScript, vous pouvez ajouter ou modifier les propriétés.

champ d'application du modèle.

champ d'application est un JavaScript propriétés et méthodes avec ces attributs et méthodes objet peuvent être utilisés dans les vues et les contrôleurs.

AngularJS exemples

Si vous modifiez la vue, le modèle et le contrôleur sera mis à jour:

<Div ng-app = "myApp ng-contrôleur" = "myCtrl">

<Entrée ng-model = "nom ">

<H1> Mon nom est {{name}} </ h1 >

</ Div>

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

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

Essayez »

portée portée

Comprendre la portée que vous utilisez actuellement est très important.

Dans les deux cas, il n'y a qu'une portée de la portée, le processus est relativement simple, mais dans de grands projets, HTML DOM a plusieurs étendues, alors vous avez besoin de connaître la portée de la portée correspondante est ce que vous utilisez a.

AngularJS exemples

Lorsque nous utilisons la commandeng-repeat, ont visité chaque copie de l'objet en double courant:

<Div ng-app = "myApp ng-contrôleur" = "myCtrl">

<Ul>
<Li ng-repeat = "x dans les noms"> {{x}} </ li>
</ Ul>

</ Div>

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

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

Essayez »

Chaque élément<li> peut accéder aux objets en double courant, voici une chaîne correspondante, et variable xindique.

racine portée

Toutes les applications ont unrootScope de $, il est appliqué à tous les éléments HTML directive ng-appcontient.

$ RootScope peut agir sur l'ensemble de l' application.Chaque contrôleur est dans la portée du pont. Rootscope à la valeur définie dans chaque dispositif de commande peut être utilisée dans.

AngularJS exemples

Lorsque vous créez un contrôleur à $ rootScope passé en paramètre peut être utilisé dans l'application:

<Div ng-app = "myApp ng-contrôleur" = "myCtrl">

<H1> {{Lastname}} membres de la famille: </ h1>

<Ul>
<Li ng-repeat = "x dans les noms"> {{x}} {{lastname}} </ li>
</ Ul>

</ Div>

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

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

Essayez »