<!DOCTYPE html>
<html ng-app="app">
  <head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
    <script src="//code.angularjs.org/1.2.19/i18n/angular-locale_es-es.js"></script>
    <script src="script.js"></script>
  </head>
  <body ng-controller="PruebaController">
    {{mensaje}}
    <br>
    {{progreso}}
    <br>
    <br>
    {{mensajeCero}}
    <br>
    {{progresoCero}}
    <br>
    <br>
    {{mensajeMultipleArray}}
    <br>
    {{progresoMultipleArray}}    
    <br>
    <br>
    {{mensajeMultipleObjetos}}
    <br>
    {{progresoMultipleObjetos}}      
    <br>
    <br>
    {{mensajeEncadenada}}
    <br>
    {{progresoEncadenada}}    
    
  </body>
</html>
var app = angular.module("app", []);

app.controller("PruebaController", ['$scope', '$q', '$timeout',function($scope, $q, $timeout) {

    

    function sumaAsincrona(a, b) {
      
      if ((a===0) && (b===0)) {
        return $q.when(0);
      }
      
      var defered = $q.defer();
      var promise = defered.promise;


      $timeout(function() {
        defered.notify(0);
      }, 1);
      $timeout(function() {
        defered.notify(33);
      }, 1000);
      $timeout(function() {
        defered.notify(66);
      }, 2000);
      
      $timeout(function() {
        try {
          var resultado = a + b;
          defered.notify(100);
          
          defered.resolve(resultado);
        } catch (e) {
          defered.reject(e);
        }
      }, 3000);
      return promise;
    }




  
    //Ejemplo con notificación al final y mensajes de progreso
    $scope.mensaje = "Esperando a que se resuelva la promesa"
    var promise = sumaAsincrona(5,2);

    promise.then(function(resultado) {
      $scope.mensaje = "El resultado de la promesa es:" + resultado;
    }, function(error) {
      $scope.mensaje = "Se ha producido un error al obtener el dato:" + error;
    }, function(progreso) {
      $scope.progreso = progreso+"%";
    });
    
    promise["finally"](function() {
      alert("Mensaje del ejemplo.Esto se llama justo antes de resolver o rechazar la promesa.");
    });
    
    
    
    
    
    
    
    
    //Ejemplo de promesa con valor inmediato
    $scope.mensajeCero = "Esperando a que se resuelva la promesa con valor inmediato";
    var promiseCero=sumaAsincrona(0,0);
    
    promiseCero.then(function(resultado) {
      $scope.mensajeCero = "El resultado de la promesa con valor inmediato es:" + resultado;
    }, function(error) {
      $scope.mensajeCero = "Se ha producido un error al obtener el dato de la promesa con valor inmediato:" + error;
    }, function(progreso) {
      $scope.progresoCero = progreso+"%";
    });
    





    //Ejemplo promesas en paralelo en forma de Array
    $scope.mensajeMultipleArray = "Esperando a una promesa múltiple formada por muchas promesas en forma de Array";
    var promesaMultipleArray=$q.all([sumaAsincrona(0,0),sumaAsincrona(1,0),sumaAsincrona(2,0)]);
    
    promesaMultipleArray.then(function(resultado) {
      $scope.mensajeMultipleArray = "El resultado de la promesa múltiple formada por muchas promesas en forma de Array es:" + resultado[0] + "," + resultado[1] + "," + resultado[2];
    }, function(error) {
      $scope.mensajeMultipleArray ="Se ha producido un error en alguna de las multiples promesas:"+error;
    }, function(progreso) {
      $scope.progresoMultipleArray = progreso+"%";
    });
    







    //Ejemplo de promesas en paralelo en forma de Objeto
    $scope.mensajeMultipleObjetos = "Esperando a una promesa múltiple formada por muchas promesas en forma de Objeto";
    var promesaMultipleObjetos=$q.all({
      promesaA : sumaAsincrona(0,0),
      promesaB : sumaAsincrona(1,0),
      promesaC : sumaAsincrona(2,0)
    });
    
    promesaMultipleObjetos.then(function(resultado) {
      $scope.mensajeMultipleObjetos = "El resultado de la promesa múltiple formada por muchas promesas en forma de Objeto es:" + resultado.promesaA + "," + resultado.promesaB + "," + resultado.promesaC;
    }, function(error) {
      $scope.mensajeMultipleObjetos ="Se ha producido un error en alguna de las multiples promesas:"+error;
    }, function(progreso) {
      $scope.progresoMultipleObjetos = progreso+"%";
    });
    
    
    
    
    
    
    
    
    //Ejemplo de promesas encadenadas.
    $scope.mensajeEncadenada="Esperando el resultado de promesas encadenadas, esto tardará 12 segundos..... ";
    var promesasEncadenadas=sumaAsincrona(1,1);
    
    promesasEncadenadas.then(function(resultado) {
      return sumaAsincrona(resultado,resultado);
    }).then(function(resultado) {
      return sumaAsincrona(resultado,resultado);
    },function(error) {
      return 4;
    }).then(function(resultado) {
      return sumaAsincrona(resultado,resultado);
    }).then(function(resultado) {
      $scope.mensajeEncadenada="El resultado de las promesas encadenadas es:" + resultado;
    },function(error) {
      $scope.mensajeEncadenada="Se ha producido un error en alguna de las promesas:"+error;
    },function(progreso) {
      $scope.progresoEncadenada=progreso+"%";
    });
    
    

}]);
Ejemplos de promesas avanzadas