logo angularJS

Aprendiendo AngularJS (VI). Los servicios en AngularJS

Se denominan servicios en AngularJS a aquellos objetos o funciones que puedes utilizar en tus aplicaciones. Algunos de estos servicios ya están en el DOM pero al tenerlos también en Angular hace que las aplicaciones sean más homogéneas y potentes.

Además de los servicios disponibles puedes crearte tu propio servicio si es necesario.

Veamos un ejemplo de un servicio. Utilizaremos en este ejemplo el servicio $interval:

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myfpschoolApp" ng-controller="myfpschoolCtrl">

<h2>Sucesión de Fibonacci:</h2>

<h3>{{txt}}</h3>

</div>

<p>Cada segundo, nuestra aplicación irá creando un valor más de la sucesión de fibonacci.</p>

<script>
var app = angular.module('myfpschoolApp', []);
app.controller('myfpschoolCtrl', function($scope, $interval) {
$scope.var1 = 0;
$scope.var2 = 1;
$scope.txt = "0,1";
$interval(function () {
$scope.aux = $scope.var1 + $scope.var2;
$scope.var1 = $scope.var2;
$scope.var2 = $scope.aux;
$scope.txt = $scope.txt+","+$scope.var2;
}, 500);
});
</script>

</body>
</html>

Como puedes ver, con $interval podemos ejecutar parte de nuestro código cada cierto tiempo. El retraso lo podemos especificar en milisegundos al realizar la llamada. En nuestro caso hemos elegido 500 milisegundos (medio segundo).

Ejercicio 6.1.
Copia y ejecuta el código anterior.
Ejercicio 6.2.
¿Dónde podemos encontrar el homólogo de $interval en el DOM?
Ejercicio 6.3.
Investiga cómo funciona el servicio $http y pon un par de ejemplos de utilización.
¿Qué cosas piensas que se puede hacer con este servicio?

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>