Explication de la portée de la portée dans angulairejs

Cet article présente principalement l'explication détaillée de la portée dans l'apprentissage d'Angularjs. Maintenant, je la partage avec vous et la donne comme référence.

Introduction

Scope est le lien entre HTML (vue) et JavaScript (contrôleur).

Scope est un objet qui stocke le modèle de données de l'application, avec les méthodes et propriétés disponibles.

Scope peut être appliqué aux vues et aux contrôleurs.

Scope est le lien entre le contrôleur et la vue de l'application Web :

Controller--> Scope--> ---> View (DOM)

<p ng-controller="myCtrl">
<h1>{{name}}</h1>
</p>

<script>
var app = angular.module(&#39;test&#39;, []);
app.controller(&#39;myCtrl&#39;, function($scope) {
  $scope.name = "天下行走";
});
</script>

L'application AngularJS est composée comme suit :

<p ng-app="myApp" ng-controller="myCtrl">
  输入你的名字：
  <input ng-model="name">
  <h1>{{greeting}}</h1>
  <button ng-click=&#39;sayHello()&#39;>greet</button>  
</p>

<script>
var app = angular.module(&#39;myApp&#39;, []);
app.controller(&#39;myCtrl&#39;, function($scope) {
  $scope.name = "张三";
  $scope.sayHello = function() {
    $scope.greeting = $scope.name + &#39;是个笨蛋!&#39;;
  };
});
</script>

1. Contrôleur : MyCtrl , qui fait référence à $scope et dans celui-ci Deux propriétés et une méthode est enregistrée sur l'objet

2. $scope : contient le modèle de données requis pour l'exemple ci-dessus, y compris l'attribut de nom et l'attribut de salutation (Remarque : ceci est dans sayHello() enregistré lorsque la méthode est appelé) et la méthode sayHello()

3. View : possède une zone de saisie, un bouton et un bloc de contenu qui utilise une liaison bidirectionnelle pour afficher les données

1. Allez à la portée en fonction du nom dans ng-model. S'il y a déjà une valeur, alors. utilisez cette valeur par défaut pour remplir la zone de saisie actuelle

2. Acceptez la saisie de l'utilisateur et transmettez la chaîne saisie par l'utilisateur au nom À ce moment, la valeur de l'attribut dans la portée est mise à jour en réel. time à la valeur saisie par l'utilisateur

1. Étape initiale : lorsque l'utilisateur ne clique pas sur le bouton, aucun contenu n'est affiché

2. Étape de valeur : après que l'utilisateur a cliqué, cette expression obtiendra l'attribut de salutation de la portée, et dans cet exemple, cette portée et le contrôleur sont les mêmes. À ce stade, l'attribut de salutation sous la portée existe déjà et cet attribut est récupéré. en ce moment

3. Phase de calcul : Dans le courant Descendez la portée pour calculer l'expression de salutation, puis restituez la vue, montrant que Zhang San est un imbécile !

Solution à l'erreur d'exécution d'angularjs après avoir utilisé la compression gulp-uglify

Vue+ElementUI implémente le rendu dynamique des formulaires, Méthode de configuration visuelle

Une brève discussion sur la solution aux fichiers excessivement volumineux après l'empaquetage du webpack

Résoudre réellement le problème de l'erreur UglifyJs lors de l'empaquetage d'iview (tutoriel détaillé)

Le problème de l'actualisation de 404 après avoir utilisé vue pour empaqueter le projet (tutoriel détaillé)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!