1. Home
  2. AngularJS Controladores

El mejor tutorial de AngularJS Controladores en 2024. En este tutorial podrás aprender AngularJS Controladores,AngularJS ejemplos,método de controlador,AngularJS ejemplos,controlador de archivo externo,AngularJS ejemplos,otros ejemplos,AngularJS ejemplos,

AngularJS Controladores

AngularJS AngularJS aplicaciones de controlador de datos.

AngularJS controlador es normal objeto de JavaScript.

AngularJS Controladores

aplicación AngularJS es controlador.

Directiva ng-controlador define el controlador de la aplicación.

El controlador es un objeto JavaScript creado por el constructor de los objetos JavaScript estándar.

AngularJS ejemplos

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

Nombre: <input type = "text" ng-modelo = "Nombre"> <br>
Apellido: <input type = "text" ng-modelo = "Apellido"> <br>
<Br>
Nombre: {{firstName + "" + lastName}}

</ Div>

<Script>
var app = angular.module ( 'myApp', []);
app.controller ( 'myCtrl', function ($ ámbito de aplicación) {
$ Scope.firstName = "Juan";
$ Scope.lastName = "Doe";
});
</ Script>

Trate »

Análisis de la aplicación:

AngularJS aplicaciones definidas por el ng-app. Las aplicaciones que se ejecutan en <div> en el interior.

ng-controller = "myCtrl"? propiedad es una instrucción de AngularJS. Se utiliza para definir un controlador.

myCtrl función es una función de JavaScript.

AngularJS usando el objeto $ alcance para llamar al controlador.

En los AngularJS, $ ámbito de aplicación es una aplicación como (variables y funciones que pertenecen a la aplicación).

Controlador $ ámbito de aplicación (equivalente al ámbito de aplicación, el rango de control) para guardar AngularJS Model (Modelo) objetos.

alcance del controlador creado dos propiedades (nombre y apellido).

campos ng-modelo de entrada directiva enlazar con el controlador de atributos (nombre y apellido).

método de controlador

El ejemplo anterior ilustra un objeto controlador y la propiedad Nombre Apellido con los dos.

El controlador también puede tener métodos (funciones y variables):

AngularJS ejemplos

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

Nombre: <input type = "text" ng-modelo = "Nombre"> <br>
Apellido: <input type = "text" ng-modelo = "Apellido"> <br>
<Br>
Nombre: {{fullName ()}}

</ Div>

<Script>
var app = angular.module ( 'myApp', []);
app.controller ( 'personCtrl', function ($ ámbito de aplicación) {
$ Scope.firstName = "Juan";
$ Scope.lastName = "Doe";
$ Scope.fullName = function () {
return $ scope.firstName + "" + $ scope.lastName;
}
});
</ Script>

Trate »

controlador de archivo externo

En aplicaciones de gran tamaño, el controlador normalmente se almacena en un archivo externo.

En pocas palabras etiqueta <script> Copia el código llamado personController.js archivo externo puede ser:

AngularJS ejemplos

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

Nombre: <input type = " text" ng-modelo = "Nombre"> <br>
Apellido: <input type = " text" ng-modelo = "Apellido"> <br>
<Br>
Nombre Completo: {{firstName + " " + lastName}}

</ Div>

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

Trate »

otros ejemplos

El siguiente ejemplo crea un nuevo archivo de controlador:

angular.module ( 'myApp', []). controlador ( 'namesCtrl', function ($ ámbito de aplicación) {
$ Scope.names = [
{Nombre: 'Jani', país: 'Noruega'},
{Nombre: 'Hege', país: "Suecia"},
{Nombre: 'Kai', país: «Dinamarca»}
];
});

Guarde el archivo como namesController.js :

Luego, utilizando el controlador en el archivo de aplicación:

AngularJS ejemplos

<Div ng-app = "myApp " ng-controller = "namesCtrl">

<Ul>
<Li ng-repeat = "x en los nombres">
{{X.name + ',' + x.country}}
</ Li>
</ Ul>

</ Div>

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

Trate »

Hot Tutorials

Contact US

AngularJS Controladores
10/30