El scope, un término que encontrarás nombrado hasta la saciedad en la literatura relacionada con este framework de Javascript. ¿Qué es exactamente el scope? ¿Qué podemos decir sobre él para completar lo visto hasta ahora en el Manual de AngularJS? Sobre todo ello vamos a hablar en este artículo. La traducción de scope es «ámbito», sin embargo, el término es tan habitual que solemos usar directamente la palabra en inglés. Pero creo que usando la traducción nos podemos enterar mejor qué es en realidad el scope: el «ámbito» de los datos donde estamos trabajando en las vistas. En Angular no… Continuar leyendo →

Qué son las factorías Las factorías son como contenedores de código que podemos usar en nuestros sitios desarrollados con AngularJS. Son un tipo de servicio, «service» en Angular, con el que podemos implementar librerías de funciones o almacenar datos. Cuando las usamos tienen la particularidad de devolvernos un dato, de cualquier tipo. Lo común es que nos devuelvan un objeto de Javascript donde podremos encontrar datos (propiedades) y operaciones (métodos). Con diferencia de los controladores, las factorías tienen la característica de ser instanciados una única vez dentro de las aplicaciones, por lo que no pierden su estado. Por tanto, son… Continuar leyendo →

Es común usar más de un controlador en una aplicación AngularJS. Hasta ahora no lo habíamos necesitado pero para separar nuestro código en controladores puede aportar diversos beneficios, en el caso que tenga algún sentido esa separación. En el ejemplo que os traemos queda bien claro que tiene sentido separar el código en dos controladores distintos, porque están pensados para hacer cosas muy específicas y distintas entre si. Observarás que separar la complejidad del programa en diversas partes, provoca que cada una sea más simple y fácil de entender. Todo ello redundará en un mantenimiento más sencillo, lo que al… Continuar leyendo →

Hasta ahora en el Manual de AngularJS hemos visto muchas cosas interesantes, sin embargo nos hemos limitado a hacer aplicaciones en las que solo teníamos una ruta y una vista. Sin embargo, cuando se vayan complicando los requisitos de nuestras aplicaciones podremos necesitar ampliar estas posibilidades. Lo que vamos a aprender ahora es a crear rutas distintas dentro de nuestra aplicación, de modo que tengamos varias URL que muestran vistas distintas. Quizás te preguntes ¿Si AngularJS está especialmente indicado para hacer aplicaciones de una sola página (concepto que se conoce con el nombre de «Single Page Application», SPA), por qué… Continuar leyendo →

Hemos visto cómo realizar operaciones básicas de Ajax con AngularJS, en las que recibimos información del servidor, por medio de get. Ahora veamos también cómo se enviarían datos al servidor por medio de la operación post del HTTP. Como siempre las cosas con AngularJS se hacen muy sencillas. El servicio («service» en la terminología de Angular) $http nos ofrece una serie de métodos «shortcut» enfocados en realizar las operaciones típicas implementadas dentro del protocolo HTTP. Para enviar datos post disponemos de $http.post(). En ese método podemos enviar como parámetro, aparte de la URL del servidor donde haremos el post, un… Continuar leyendo →

JSONP es un mecanismo muy útil cuando estamos trabajando con Ajax en Javascript y queremos traernos datos que residen en otro servidor. Existe una problemática por la cual no puedes cargar datos con Javascript que te vengan desde servidores de otros dominios, pues puede darte un error de seguridad si es que el servidor al que te conectas no está configurado para aceptar solicitudes «cross domain». Conexiones HTTP asíncronas en AngularJS Para realizar solicitudes al servidor asíncronas (lo que se conoce habitualmente por Ajax en el mundo del desarrollo web) con AngularJS necesitamos un servicio llamado $http. Este «service» nos… Continuar leyendo →

Ajax es una solicitud HTTP realizada de manera asíncrona con Javascript, para obtener datos de un servidor y mostrarlos en el cliente sin tener que recargar la página entera. Service $http El servicio $http (service en inglés, tal como se conoce en AngularJS) es una funcionalidad que forma parte del núcleo de Angular. Sirve para realizar comunicaciones con servidores, por medio de HTTP, a través de Ajax y vía el objeto XMLHttpRequest nativo de Javascript o vía JSONP. Después de esa denominación formal, que encontramos en la documentación de AngularJS, te debes de quedar por ahora en que nos sirve… Continuar leyendo →

La directiva ngRepeat de AngularJS es una de esas cosas que llaman la atención, por la sencillez y rapidez con la que se puede implementar un bucle que nos repite una plantilla HTML, pero sobre todo por su potencia. Sintaxis ngRepeat Nos tenemos que familiarizar primero con la sintaxis usada para especificar el comportamiento del bucle en ngRepeat. Aunque ya lo hemos visto en cantidad de ejemplos, comencemos por repasar la sintaxis básica. <p ng-repeat=»elem in elementos»> {{ elem }} </p> En la directiva indicamos el recorrido a una colección y la variable donde vamos a tener el elemento actual:… Continuar leyendo →

En el estilo de aplicaciones que se hacen con AngularJS trabajas de manera intensiva con campos de formulario. Puedes leer este artículo para aprender todo sobre los checkbox y hacer algún ejemplo práctico. En Angular los campos input checkbox tienen una serie de directivas que podemos usar: ngModel: indica el nombre con el que se conocerá a este elemento en el modelo/scope. ngTrueValue: La utilizas si deseas asignar un valor personalizado al elemento cuando el campo checkbox está marcado. ngFalseValue: es lo mismo que ngTrueValue, pero en este caso con el valor asignado cuando el campo no está «checado». ngChange:… Continuar leyendo →