| Ambos lados, revisión anteriorRevisión previa | |
| unidades:03_servicios:10_ejemploseguro [2014/08/01 09:52] – admin | unidades:03_servicios:10_ejemploseguro [2014/08/29 22:15] (actual) – admin |
|---|
| En este tema retornamos el ejemplo del seguro médico para añadir un ''provider''. | En este tema retornamos el ejemplo del seguro médico para añadir un ''provider''. |
| |
| Al ver el servicio ''$http'' en el tema [[unidades:03_servicios:02_http]] vimos que no debía hacerse una llamada a ''$http'' en el propio controlador . Ahora vamos a crea un ''provider'' que encapsule la llamada a ''$http''. | Al ver el servicio ''$http'' en el tema [[unidades:03_servicios:02_http]] vimos que no debía hacerse una llamada a ''$http'' en el propio controlador . Ahora vamos a crear un ''provider'' que encapsule la llamada a ''$http''. |
| |
| El servicio será un objeto llamado ''remoteResource'' que nos permitirá acceder al servidor para acceder a los datos. Como aun no hemos visto la parte de servidor ni la parte de REST ni las promesas , solo vamos a hacer un único método sencillo que nos permita leer los datos, mas adelante en el curso seguiremos mejorando este servicio. Por lo tanto aun será un poco chapuza el ejemplo. | El servicio será un objeto llamado ''remoteResource'' que nos permitirá acceder al servidor para acceder a los datos. Como aún no hemos visto la parte de servidor ni la parte de REST ni las promesas , sólo vamos a hacer un único método sencillo que nos permita leer los datos. Más adelante en el curso seguiremos mejorando este servicio. Por lo tanto aun será un poco chapuza el ejemplo. |
| |
| ===== La configuración ===== | ===== La configuración ===== |
| |
| Nuestro servicio va a ser un ''provider'' ya que tenemos que indicar la url a partir de la que se debe bajar los datos. Como hemos hecho en el tema anterior eso lo pondremos en una constante de nuestra aplicación. | Nuestro servicio va a ser un ''provider'' ya que tenemos que indicar la url a partir de la que debemos bajar los datos. Como hemos hecho en el tema anterior éso lo pondremos en una constante de nuestra aplicación. |
| |
| <sxh js> | <sxh js> |
| </sxh> | </sxh> |
| |
| La contante vale el valor "." porque los datos a bajar están en la misma ruta que nuestra página web. | La constante vale el valor "." porque los datos a bajar están en la misma ruta que nuestra página web. |
| |
| El provider tendrá un único método para configurarlo llamado ''setBaseUrl'' por lo que tendremos el siguiente bloque config: | El provider tendrá un único método para configurarlo llamado ''setBaseUrl'' por lo que tendremos el siguiente bloque config: |
| </sxh> | </sxh> |
| |
| Fijaté como el nombre del provider es "remoteResourceProvider", es decir que acaba en "Provider" aunque nuestro servicio solo se llama "remoteResource". | Fíjate cómo el nombre del provider es "remoteResourceProvider", es decir que acaba en "Provider" aunque nuestro servicio sólo se llama "remoteResource". |
| |
| ===== El provider ===== | ===== El provider ===== |
| |
| * Línea 1: Definimos el constructor de la clase ''RemoteResourceProvider'' | * Línea 1: Definimos el constructor de la clase ''RemoteResourceProvider'' |
| * Línea 3: Un método público llamado ''setBaseUrl'' para configurar el servicio. Este es el método que hemos llamado desde el bloque config. | * Línea 3: Un método público llamado ''setBaseUrl'' para configurar el servicio. Éste es el método que hemos llamado desde el bloque config. |
| * Línea 6: El método ''$get'' que es el factory-provider con la función de factoría a la que se le inyecta el servicio de ''$http''. | * Línea 6: El método ''$get'', que es el factory-provider con la función de factoría a la que se le inyecta el servicio de ''$http''. |
| * Línea 7: Ahora la función de factoría crea el nuevo objeto de la clase ''RemoteResource''. Siendo esta clase realmente la que hace todo el trabajo y la que se usará desde el controlador. En el constructor además de pasarle el ''$http'' que necesita, también se le pasa la URL Base para configurar el servicio. | * Línea 7: Ahora la función de factoría crea el nuevo objeto de la clase ''RemoteResource'', siendo esta clase realmente la que hace todo el trabajo y la que se usará desde el controlador. En el constructor además de pasarle el ''$http'' que necesita, también se le pasa la URL Base para configurar el servicio. |
| * Línea 11: Finalmente se registra el ''provider''. | * Línea 11: Finalmente se registra el ''provider''. |
| |
| |
| ===== El controlador ===== | ===== El controlador ===== |
| Por último nos queda ver como queda el controlador al usar el nuevo servicio. | Por último nos queda ver cómo queda el controlador al usar el nuevo servicio. |
| |
| <sxh js;highlight: [1,26,27,28,29,30]> | <sxh js;highlight: [1,26,27,28,29,30]> |
| </sxh> | </sxh> |
| |
| Este código aunque funciona no es recomendable por lo complejo que resulta de entender. | Este código - aunque funciona - no es recomendable por lo complejo que resulta de entender. |
| |
| ===== Referencias ===== | ===== Referencias ===== |
| * [[https://github.com/johnpapa/angularjs-styleguide/blob/master/README.md|AngularJS Style Guide by @john_papa]] | * [[https://github.com/johnpapa/angularjs-styleguide/blob/master/README.md|AngularJS Style Guide by @john_papa]] |
| * [[https://github.com/toddmotto/angularjs-styleguide/blob/master/README.md|AngularJS styleguide by @toddmotto]] | * [[https://github.com/toddmotto/angularjs-styleguide/blob/master/README.md|AngularJS styleguide by @toddmotto]] |
