3.8 factory

En este tema vamos a ver el servicio de factory. La principal diferencia ahora es que al método factory le pasamos ahora una función para que ésta retorne ahora el valor del servicio. Es decir que tenemos una función JavaScript que actúa como factoría, retornando la propia función de factoría el valor del servicio.

Para que se entienda vamos a ver los ejemplos que teníamos con el value ahora como un factory.

var app=angular.module("app",[]);
 
app.factory("idioma",function() {
  return "es-es";
});
 
app.factory("matematicas_simples",function() { 
  return {
    sumar:function(a,b) {
      return a+b;
    },
    restar:function(a,b) {
      return a-b;
    }
  }
});
 
app.factory("radio",function() {
  return 10;
});
 
app.factory("area",function() {
  return function(radio) {
    return 3.1416*radio*radio;
  }
});
 
app.controller("PruebaController",["$scope","idioma","matematicas_simples","radio","area",function($scope,idioma,matematicas_simples,radio,area) {
  $scope.idioma=idioma;
  $scope.suma=matematicas_simples.sumar(3,6);
  $scope.area=area(radio);
}]);

• Líneas 3-5: Ahora al servicio de “idioma”, le pasamos una función anónima y dicha función retorna el String “es-es”, que es el verdadero valor del sevicio. Es decir la función anónima es una factoría que crea el valor . Aunque crearlo es simplemente crear el String.
• Líneas 7-16: El valor del servicio “matematicas_simples” era un objeto javaScript con los métodos sumar y restar. Al ser un factory ahora le pasamos la función anónima de factoría que retorna el objeto JavaScript.
• Líneas 18-20: En el servicio de “radio” , la función anónima retorna el valor del servicio que es un 10.
• Líneas 22-26: El valor del servicio “area” es una función que calcula el área, por lo tanto la función anónima debe retorna la función que calcula el área. Es decir es una función que retorna otra función.
• Línea 28: Por último vemos que en el controlador se usan igual los servicios independientemente de si son value o factory, etc.

Al igual que en el service se podían inyectar dependencias en el constructor , en un factory se pueden inyectar dependencias en la función de factoría.

Vamos a hacer el ejemplo del tema anterior del service con la clase Rectangulo usando un servicio:

var app=angular.module("app",[]);

app.value("tamanyoInicialRectangulo",{
  ancho:2,
  alto:3
});

function Rectangulo(tamanyoInicial) {
  this.ancho=tamanyoInicial.ancho;
  this.alto=tamanyoInicial.alto;
  
  this.setAncho=function(ancho) {
    this.ancho=ancho;
  }
  
  this.setAlto=function(alto) {
    this.alto=alto;
  }  
  
  this.getArea=function() {
    return this.ancho * this.alto;
  }
}

app.factory("rectangulo",['tamanyoInicialRectangulo',function(tamanyoInicialRectangulo) {
  var rectangulo=new Rectangulo(tamanyoInicialRectangulo);
  
  return rectangulo;
}]);


app.controller("PruebaController",["$scope","rectangulo",function($scope,rectangulo) {
  $scope.area=rectangulo.getArea();
}]);

• Línea 25: Como ya hemos visto en las funciones de los controladores, inyectamos la dependencia tamanyoInicialRectangulo simplemente añadiendo el array con el nombre y poniendo la variable como argumento de la función.
• Línea 26: Aquí es cuando se ve realmente que es una función de factoría. Estamos creando el valor del servicio al crear el objeto rectangulo. Vemos como le estamos pasando al constructor, el valor que inyectamos a la función.
• Línea 28: como ya sabemos se debe retornar el valor del servicio.

Esta es la típica pregunta que aparece siempre en los foros de AngularJS y la respuesta es bastante sencilla. Realmente da igual cual uses porque todos acaban siendo un provider para AngularJS. Pero aun así ¿cual es mas recomendable?

1. Si tienes una clase de la que es necesario crear una instancia mejor usa un service: Solo tendrás que pasarle el nombre de la clase y ya está.
2. Si tienes directamente el valor mejor usar el value: Solo tendrás que pasarle ese valor y ya está.
3. Si no queda mas remedio entonces usar el factory: Es lo mas complejo de usar así que debería ser siempre la última opción.

En el siguiente tema por fin veremos el provider el cual tiene una funcionalidad extra al factory que si la necesitamos hará que debamos usarlo.

• / Developer Guide / Providers / Factory