Diferencias

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

--- unidades:09_directivas:04_ejemploseguro [2014/08/29 19:59] – [9.4 Ejemplo de directiva] admin
+++ unidades:09_directivas:04_ejemploseguro [2014/09/07 09:45] (actual) – admin
@@ Línea 3: / Línea 3: @@
 Para que funciona el Datepicker es necesario añadir lo siguiente a la página ''index.html'':
+  * CSS de JQuery UI
   * JavaScript de JQuery
   * JavaScript de JQuery UI
-  * CSS de JQuery UI
 <sxh html>
@@ Línea 31: / Línea 31: @@
 <sxh js;highlight: [3,6,7]>
 app.directive('caDatepicker', [function(dateFormat) {
-        return {
+  return {
-            restrict: 'A',
+    restrict: 'A',
-            link: function($scope, element, attributes) {
+    link: function($scope, element, attributes) {
-                element.datepicker({
+      element.datepicker({
-                    dateFormat: attributes.caDatepicker
+        dateFormat: attributes.caDatepicker
-                });
+      });
-            }
+    }
-        };
+  };
-    }]);
+}]);
 </sxh>
   * Línea 3: Decimos que solo se puede usar como Atributo HTML
@@ Línea 81: / Línea 81: @@
   * Linea 8: Añadimos la función de //callback// del evento ''onSelect''
   * Línea 9: Lanzamos un evento de ''onChange'' en el ''<input>'' para que AngularJS sepa que algo ha cambiado y actualice consecuentemente la propiedad ''$scope.seguro.fechaCreacion''.
+<note important>
+La directiva realmente está sin acabar ya que también debería de transformar el dato de tipo String del ''<input>'' en un objeto ''Date'' cuando se guarda en ''$scope.seguro.fechaCreacion''. Es decir que ''$scope.seguro.fechaCreacion'' debería ser de tipo Date en vez de tipo String.
+Eso ya lo veremos en la unidad [[unidades:13_formulariosadv:00_start]].
+</note>
 ===== Ejemplo =====
 {{url>http://embed.plnkr.co/euC4cS}}
+===== Referencias =====
+  * [[http://api.jqueryui.com/datepicker|Datepicker]]