Comment utiliser le contrôleur AngularJS ? Le contrôleur Angularjs contrôle la résolution de l'instance d'application Angularjs

Cet article présente principalement l'utilisation du contrôleur angularjs. Le contrôleur angulairejs contrôle les données de l'application angulairejs. Jetons maintenant un coup d'œil à cet article

Introduction au contrôleur AngularJS :

Contrôleur AngularJSContrôle données de l'application AngularJS.

Les contrôleurs AngularJS sont des objets JavaScript classiques.

Contrôleurs AngularJS

Les applications AngularJS sont contrôlées par des contrôleurs. La directive

ng-controller définit un contrôleur d'application.

Les contrôleurs sont des objets JavaScript, créés par le constructeur d'objets JavaScript standard.

<p ng-app="myApp" ng-controller="myCtrl">

名: <input type="text" ng-model="firstName"><br>
名: <input type="text" ng-model="lastName"><br>
<br>
姓名: {{firstName + " " + lastName}}

</p>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.firstName = "John";
    $scope.lastName = "Doe";
});
</script>

Analyse des applications :

Les applications AngularJS sont définies par ng-app. L'application s'exécute dans

. L'attribut

ng-controller="myCtrl" est une directive AngularJS. est utilisé pour définir un contrôleur. La fonction

myCtrl est une fonction JavaScript .

AngularJS utilise l'objet $scope pour appeler les contrôleurs.

Dans AngularJS, $scope est un objet d'application (appartenant aux variables et fonctions d'application).

Le $scope du contrôleur (équivalent à la portée, la portée du contrôle) est utilisé pour enregistrer les objets du modèle AngularJS. Le contrôleur

crée deux propriétés dans la portée (firstName et lastName). La directive

ng-model lie le champ de saisie aux propriétés du contrôleur (firstName et lastName). (Si vous souhaitez en savoir plus, accédez au site Web PHP chinois Manuel de développement AngularJS pour en savoir plus)

Méthode du contrôleur

L'exemple ci-dessus montre une méthode avec lastName et firstName. Objet contrôleur avec deux propriétés.

Les contrôleurs peuvent également avoir des méthodes (variables et fonctions) :

<p ng-app="myApp" ng-controller="personCtrl">

名: <input type="text" ng-model="firstName"><br>
姓: <input type="text" ng-model="lastName"><br>
<br>
姓名: {{fullName()}}

</p>

<script>
var app = angular.module('myApp', []);
app.controller('personCtrl', function($scope) {
     $scope.firstName = "John";
    $scope.lastName = "Doe";
    $scope.fullName = function() {
        return $scope.firstName + " " + $scope.lastName;
    }
});
</script>

Contrôleurs dans des fichiers externes

Dans les grandes applications, il est courant de placer les contrôles stockés dans un fichier externe déposer.

Copiez simplement le code dans la balise

• Une analyse approfondie du composant de groupe de liste Bootstrap
• Explication détaillée du currying de la fonction JavaScript
• Exemple complet de génération de mot de passe JS et de détection de force (avec téléchargement du code source de démonstration)
• Angularjs intègre l'interface utilisateur WeChat (weui)
• Comment basculer rapidement entre le chinois traditionnel et le chinois simplifié avec JavaScript et l'astuce permettant aux sites Web de prendre en charge le basculement entre les compétences en chinois simplifié et traditionnel_javascript