Diferencias

Muestra las diferencias entre dos versiones de la página.

Enlace a la vista de comparación

unidades:03_servicios:05_constant [2014/07/28 12:43]
admin
unidades:03_servicios:05_constant [2014/08/29 21:36] (actual)
admin
Línea 1: Línea 1:
 ====== 3.5 constant ====== ====== 3.5 constant ======
-Una ''​constant''​ es un servicio al que le pasamos directamente el valor de dicho servicio. Su principal característica es que se puede inyectar en cualquier sitio. Se define llamando al método ''​constant''​ de un módulo.A dicho método ​se pasaremos el nombre de la constante y su valor.+Una ''​constant''​ es un servicio al que le pasamos directamente el valor de dicho servicio. Su principal característica es que se puede inyectar en cualquier sitio. Se define llamando al método ''​constant''​ de un módulo.A dicho método ​le pasaremos el nombre de la constante y su valor.
  
 Veamos ahora un ejemplo de ''​constant''​. Veamos ahora un ejemplo de ''​constant''​.
Línea 20: Línea 20:
 </​sxh>​ </​sxh>​
  
-<sxh js;​title:​script.js>​+<sxh js;​title:​script.js;highlight: [3,5,6];>
 var app=angular.module("​app",​[]);​ var app=angular.module("​app",​[]);​
    
Línea 30: Línea 30:
  
 </​sxh>​ </​sxh>​
 +
 +  * Línea 3: Se crea la constante "​miServicioConstante"​ con el valor "Hola mundo"
 +  * Línea 5: Se inyecta la constante en el controlador
 +  * Línea 6: Se pone en valor de la constante en la propiedad del ''​$scope.valor''​
 +
 +Si ejecutamos el ejemplo veremos en la página HTML el texto: ​
 +  El valor de la constante "​miServicioConstante"​ = Hola mundo
 +  ​
 +===== Posibles valores =====
 +Al ser una constante parece que sólo pueda tener valores escalares pero puede tener cualquier cosa como referencias a objetos, referencia a funciones, etc.
 +
 +===== Ejemplo =====
 +Veamos ahora un ejemplo con distintos valores de constantes.
 +
 +<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.constant("​idioma","​es-es"​);​
 +
 +app.constant("​matematicas_simples",​{
 +  sumar:​function(a,​b) {
 +    return a+b;
 +  },
 +  restar:​function(a,​b) {
 +    return a-b;
 +  }
 +});
 +
 +app.constant("​radio",​10);​
 +
 +app.constant("​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 constante cuyo valor es un String
 +  * Línea 5: Se crea una constante cuyo valor es un Objeto con los métodos ''​sumar''​ y ''​restar''​
 +  * Linea 14: Se crea una constante cuyo valor es un número
 +  * Línea 16: Se crea una constante cuyo valor es una función.
 +  * Línea 20: Se inyectan todas las constantes en el controlador.
 +  * Línea 21: Se guarda el valor de la constante ''​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 dicha constante.
 +  * Línea 23: Como el valor de la constante es una función , llamamos directamente a la función pasandole como argumento el valor 10 de la constante ''​radio''​.
 +
 +<note tip>
 +Lo más interesante es ver la constante llamada ''​area''​ que es una función. Por lo tanto al obtener su valor lo llamamos como una función usando los paréntesis:​ ''​area(radio)''​.
 +</​note>​
 +
 +{{url>​http://​embed.plnkr.co/​2smrRu}}
 +
 +===== Referencias =====
 +  * [[https://​docs.angularjs.org/​guide/​providers#​constant-recipe|/​ Developer Guide / Providers / Constant Recipe]]
unidades/03_servicios/05_constant.1406544236.txt.gz · Última modificación: 2014/07/28 12:43 por admin
Ir hasta arriba
CC Attribution-Share Alike 3.0 Unported
chimeric.de = chi`s home Valid CSS Driven by DokuWiki do yourself a favour and use a real browser - get firefox!! Recent changes RSS feed Valid XHTML 1.0