Curso de AngularJS y REST

Esta página es de solo lectura. Puedes ver la fuente pero no puedes cambiarla. Pregunta a tu administrador si crees que esto es incorrecto.
====== 3.6 value ======
Un ''value'' es un servicio al que le pasamos directamente el valor de dicho servicio.  Se define llamando al método ''value'' de un módulo.A dicho método le pasaremos el nombre y su valor.

Veamos ahora un ejemplo de ''value''.

<sxh html;title:index.html>
<!DOCTYPE html>
<html ng-app="app">

  <head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
    <script src="script.js"></script>
  </head>

  <body ng-controller="PruebaController">
    El valor del value "miServicioValue" = {{valor}}
  </body>

</html>
</sxh>

<sxh js;title:script.js;highlight: [3,5,6];>
var app=angular.module("app",[]);
 
app.value("miServicioValue","Hola mundo");

app.controller("PruebaController",["$scope","miServicioValue",function($scope,miServicioValue) {
  $scope.valor=miServicioValue;  
}]);

</sxh>

  * Línea 3: Se crea el ''value'' "miServicioValue" con el valor "Hola mundo"
  * Línea 5: Se inyecta el ''value'' en el controlador
  * Línea 6: Se pone en valor de miServicioValue en la propiedad del ''$scope.valor''

Si ejecutamos el ejemplo veremos en la página HTML el texto: 
  El valor del value "miServicioValue" = Hola mundo
  
===== Posibles valores =====
El servicio ''value'' puede tener a parte de valores escalares cualquier cosa como referencias a objetos, referencia a funciones, etc.

===== Ejemplo =====
Veamos ahora un ejemplo de ''value'' con distintos valores.

<sxh html;title:index.html>
<!DOCTYPE html>
<html ng-app="app">

  <head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
    <script src="script.js"></script>
  </head>

  <body ng-controller="PruebaController">
    idioma = {{idioma}}
    <br>
    suma de 3 + 6 = {{suma}}
    <br>
    area = {{area}}
  </body>
</html>
</sxh>

<sxh js;title:script.js;highlight: [3,5,14,16,20,21,22,23];>
var app=angular.module("app",[]);

app.value("idioma","es-es");

app.value("matematicas_simples",{
  sumar:function(a,b) {
    return a+b;
  },
  restar:function(a,b) {
    return a-b;
  }
});

app.value("radio",10);

app.value("area",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);
}]);
</sxh>

  * Línea 2: Se crea una ''value'' cuyo valor es un String
  * Línea 5: Se crea una ''value'' cuyo valor es un Objeto con los métodos ''sumar'' y ''restar''
  * Linea 14: Se crea una ''value'' cuyo valor es un número
  * Línea 16: Se crea una ''value'' cuyo valor es una función.
  * Línea 20: Se inyectan todos los ''value'' en el controlador.
  * Línea 21: Se guarda el valor del ''value'' ''idioma'' en la propiedad ''$scope.idioma''.
  * Línea 22: Se guarda en ''$scope.suma'' el resultado de llamar al método ''sumar'' del objeto ''matematicas_simples'' que es el valor de dicho ''value''.
  * Línea 23: Como el valor del ''value'' es una función , llamamos directamente a la función pasándole como argumento el valor 10 del ''value'' ''radio''.

<note tip>
Lo mas interesante es ver el ''value'' llamado ''area'' que es una función. Por lo tanto al obtener su valor lo llamamos como una función usando los parentesis: ''area(radio)''.
</note>

{{url>http://embed.plnkr.co/JQUTHe}}

===== Diferencias con constant =====
Te habrás fijado que este tema es prácticamente el mismo que el de [[unidades:03_servicios:05_constant]], es decir que ha sido prácticamente cambiar ''constant'' por ''value''.

¿Cuál es entonces la diferencia entre ellos? Que como ya hemos comentado en [[unidades:03_servicios:04_tiposservicios]] los servicio de tipo ''constant'' se pueden inyectar en [[unidades:03_servicios:04_tiposservicios#bloque_configbloques]]  y en los [[unidades:03_servicios:09_provider]] mientras que los ''value'' no pueden.

===== Referencias =====
  * [[https://docs.angularjs.org/guide/providers#value-recipe|/ Developer Guide / Providers / Value]]