1. Home
  2. AngularJS Contrôleurs

Le meilleur didacticiel AngularJS Contrôleurs en 2024, dans ce didacticiel, vous pouvez apprendre AngularJS Contrôleurs,AngularJS exemples,méthode de contrôleur,AngularJS exemples,contrôleur de fichier externe,AngularJS exemples,D'autres exemples,AngularJS exemples,

AngularJS Contrôleurs

AngularJS AngularJS applications du contrôleur de données.

AngularJS contrôleur est un objet JavaScript normal.

AngularJS Contrôleurs

l'application AngularJS est contrôleur.

directive ng-contrôleur définit le contrôleur d'application.

Le contrôleur est un objet JavaScript créé par le constructeur des objets JavaScript standard.

AngularJS exemples

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

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

</ Div>

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

Essayez »

Analyse d'application:

AngularJS applications définies par le ng-app. Les applications exécutées dans <div> à l'intérieur.

ng-controller = "myCtrl"? la propriété est une instruction de AngularJS. Il est utilisé pour définir un contrôleur.

fonction myCtrl est une fonction JavaScript.

AngularJS en utilisant un objet $ portée pour appeler le contrôleur.

Dans les AngularJS, $ champ d'application est une application comme (variables et fonctions appartenant à l'application).

Contrôleur $ portée (équivalent à la portée, la plage de réglage) pour enregistrer AngularJS Modèle (Model) objets.

champ d' application du contrôleur créé deux propriétés (nom et prénom).

champs ng-modèle entrée directive de liaison au contrôleur d'attribut (nom et prénom).

méthode de contrôleur

L'exemple ci-dessus illustre un objet de contrôleur et de la propriété lastName firstName avec les deux.

Le contrôleur peut aussi avoir des méthodes (fonctions et variables):

AngularJS exemples

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

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

</ Div>

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

Essayez »

contrôleur de fichier externe

Dans les grandes applications, le contrôleur est généralement stocké dans un fichier externe.

Tout simplement balise <script> Copiez le code nommé personController.js fichier externe peut être:

AngularJS exemples

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

Prénom: <input type = " text" ng-model = "firstName"> <br>
Nom: <input type = " text" ng-model = "lastName"> <br>
<Br>
Nom complet: {{firstName + " " + lastName}}

</ Div>

<Script src = "personController.js"> </ script>

Essayez »

D'autres exemples

L'exemple suivant crée un nouveau fichier du contrôleur:

angular.module ( 'myApp', []). contrôleur ( 'namesCtrl', function ($ portée) {
$ Scope.names = [
{Nom: 'Jani', pays: «Norvège»},
{Nom: 'Hege', pays: 'Suède'},
{Nom: 'Kai', pays: Danemark '}
];
});

Enregistrez le fichier sous namesController.js :

Puis, en utilisant le contrôleur dans le dossier de candidature:

AngularJS exemples

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

<Ul>
<Li ng-repeat = "x dans les noms">
{{X.name + ',' + x.country}}
</ Li>
</ Ul>

</ Div>

<Script src = "namesController.js"> </ script>

Essayez »

Hot Didacticiel

Nous contacter

AngularJS Contrôleurs
10/30