menú
buscar
Diferencias
Muestra las diferencias entre dos versiones de la página.
|
unidades:09_directivas:01_introduccion [2014/08/28 19:32] admin [Ejemplo] |
unidades:09_directivas:01_introduccion [2014/10/28 17:05] (actual) admin [Prefijos en Directivas] |
||
|---|---|---|---|
| Línea 43: | Línea 43: | ||
| ==== Prefijos en Directivas ==== | ==== Prefijos en Directivas ==== | ||
| - | El equipo de Angular recomienda que las directivas tengan siempre un prefijo de forma que no choquen con otras directivas creadas pro otros desarrolladores o con actuales o futuras etiquetas de HTML. Por eso las directivas de AngularJS empiezan siempre por "ng". En las directivas que creemos en este curso siempre empezaran por "ca" por "Curso de Angular". | + | El equipo de Angular recomienda que las directivas tengan siempre un prefijo de forma que no choquen con otras directivas creadas por otros desarrolladores o con actuales o futuras etiquetas de HTML. Por eso las directivas de AngularJS empiezan siempre por "ng". En las directivas que creemos en este curso siempre empezaran por "ca" por "Curso de Angular". |
| Ejemplos: | Ejemplos: | ||
| * ''ng-view'' : Prefijo ''ng'' para indicar que es una directiva estándar de AngularJS | * ''ng-view'' : Prefijo ''ng'' para indicar que es una directiva estándar de AngularJS | ||
| * ''ng-repeat'' : Prefijo ''ng'' para indicar que es una directiva estándar de AngularJS | * ''ng-repeat'' : Prefijo ''ng'' para indicar que es una directiva estándar de AngularJS | ||
| - | * ''ca-paginacion'' : Prefijo ''ca''para indicar que es una directiva creada en el Curso de AngularJS | + | * ''ca-paginacion'' : Prefijo ''ca'' para indicar que es una directiva creada en el Curso de AngularJS |
| * Etc. | * Etc. | ||
| Línea 121: | Línea 121: | ||
| * Si vale "E" solo se podrá usar como elemento | * Si vale "E" solo se podrá usar como elemento | ||
| * Si vale "A" solo podrá usarse como atributo | * Si vale "A" solo podrá usarse como atributo | ||
| - | * Si vale "EA" o "AE" se podrá usar como elemento y como atributo. | + | * Si vale "EA" o "AE" se podrá usar como elemento y como atributo. Este es el funcionamiento por defecto si no se pone nada en la propiedad ''restrict''. |
| * ''replace'' : Si vale ''false'' el contenido del //template// se añadirá dentro del tag de la propia directiva. Pero si vale ''true'' se quitará el tag de la directiva y solo estará el contenido del //template//. | * ''replace'' : Si vale ''false'' el contenido del //template// se añadirá dentro del tag de la propia directiva. Pero si vale ''true'' se quitará el tag de la directiva y solo estará el contenido del //template//. | ||
| <note>En los 2 temas siguientes veremos las propiedades ''link'' y ''scope''.</note> | <note>En los 2 temas siguientes veremos las propiedades ''link'' y ''scope''.</note> | ||
| Línea 152: | Línea 152: | ||
| </sxh> | </sxh> | ||
| - | Y generaremos el siguiente HTML | + | Y la directiva generará el siguiente HTML |
| <sxh html> | <sxh html> | ||
| <h1>Hola Mundo</h1> | <h1>Hola Mundo</h1> | ||
| Línea 163: | Línea 163: | ||
| </ac-titulo> | </ac-titulo> | ||
| </sxh> | </sxh> | ||
| + | |||
| + | <note tip>Por último destacar que el template solo puede tener un tag raiz , si queremos que la directiva tenga varios tags //hernamos// deberemos ponerlos todos dentro de un nuevo tag</note> | ||
| ===== Ejemplo ===== | ===== Ejemplo ===== | ||
