lunes, 9 de marzo de 2015

AngularJS - Introducción: Controladores

¿Qué es un controlador? AngularJS emplea el concepto de controladores como el elemento que define la funcionalidad de una parte de la página. Como aproximación se puede decir que un controlador responde a las acciones sobre una interfaz de usuario, lo que permitirá modificar la salida final por pantalla. 



Desde el controlador modificaremos el modelo de datos y gracias al enlace de datos que realiza AngularJS la interfaz de usuario se actualizará para responder al cambio del modelo. Es decir, el controlador utilizará el ámbito (Ver ámbitos) correspondiente para modificar los datos y de esta forma dar funcionalidad a la parte  de la página a la que afecte el controlador.

Lo explicado se puede ver de forma más clara en el siguiente ejemplo: En un controlador se define la variable* "nombre" en el ámbito con un valor inicial y además se define una función que vacía el contenido de la variable "nombre". Desde el HTML se utiliza la variable del ámbito "nombre" para generar un saludo y en la caja de texto al hacer click se llama a la función que vacía el contenido de "nombre".



NOTA: En el HTML los datos del ámbito se enlazan escribiéndolos entre corchetes {{}} (sintaxis moustache) o dentro de directivas 'ng-' o propias. Por ejemplo, ng-bind="nombreVariable" agrega el contenido de la variable a la etiqueta que utilice esa directiva. Otro ejemplo, es el de la directiva ng-click="algunaFuncion()" 

Aprendiendo AngularJS

*Aunque en estos ejemplos y en la mayoría de los tutoriales los datos se mandan en variables del $scope, lo ideal sería pasar los datos en un objeto Javascript y que este actué como modelo de datos. Esta es una práctica que no se tiene en cuenta muy a menudo y que si no se lleva a cabo podríamos  tener problemas con la jerarquía de ámbitos.

No hay comentarios:

Publicar un comentario