angularjs-logo

Principalmente en una aplicación AngularJS depende del controlador para administrar el flujo de datos. Un controlador es definido con la directiva ng-controller. Un controlador es un objeto Javascript que contiene atributos o propiedades y funciones. Cada controlador tiene acepta un parámetro llamado $scope, el cual se refiere a la aplicación y/o modulo que este administra.

[gist]939018821725574736ab[/gist]

El controlador se declara con la directiva ng-controller, ahora se define el controlador.

[gist]cbfed1ea35b9faf3a7b4[/gist]

  • EstudiantesController se define como un objeto de javascript que recibe un parámetro $scope.
  • $scope se refiere a la aplicación o modulo que esta haciendo uso del controlador.
  • $scope.estudiante es una propiedad del controlador
  • nombre y apellido son dos atributos del objeto $scope.estudiante y son declarados por defecto.
  • nombreCompleto es una función del objeto $scope.estudiante, el cual concatena el nombre y el apellido.

Ahora, para utilizar los elementos del controlador en la vista, necesitamos de la directiva ng-model.

[gist]8ecf1ac9b0cd700fca57[/gist]

  • Se empaqueta los dos atributos del objeto $scope.estudiante en dos controles de entrada (<input>) .
  • Para obtener el nombre completo, se llama la función $scope.nombreCompleto
  • Si edita cualquier elemento contenido en los controles de entrada (<input>) se actualizaran automanticamente.

Ejecutar: https://jsfiddle.net/AFelipeTrujillo/7v1ajmes/1/