Angular

 

 

*INTERPOLACIÓN & TEMPLATE REFERENCE VARIABLE

La interpolación es la incorporación de texto dinámico dentro de las plantillas HTML para su despliegue.

Dentro de la interpolación, se observa el concepto de Template Reference Variable, el cual, al asignar un nombre a un componente de HTML, se puede utilizar el valor que almacena dicho componente.

Esto tiene la finalidad de usar variables y atributos de los componentes, además de declararlos y obtener sus valores para ser mostrados.

*BINDING

Los tipos de binding son tres:

Property: Asignar valores a las propiedades de los elementos HTML.

Event: Permite escuchar los eventos de los componentes HTML (un click, entrada de teclado, etc).

Two Way: Una forma de comunicar los componentes, es decir, envía información del HTML al componente de Angular, y viceversa.

*DIRECTIVAS

Directiva

Una directiva nos permite modificar la información que se muestra en la plantilla.

--> NgIf

Nos permite que de manera condicional, podamos agregar contenido a nuestra plantilla basado en una condición.

<div *ngIf="Condition">

Si se requiere un else, se declara de la siguiente forma:

<div *ngIf="Condition; else elseBlock">Contenido cuando la condición es true</div>

<ng-template #elseBlock>Contenido cuando la condición es falsa</ng-template>

--> NgFor

Nos permite iterar varios elementos.

*COMUNICACIÓN ENTRE COMPONENTES

Se ha trabajado hasta ahora con un solo componente.

Lo que se pretende ahora es agregar un segundo componente y establecer la comunicación entre un componente padre y un hijo.

Para ello se utilizan las directivas @input y @output.

-->@Input

Nos permite recibir información del componente padre hacia un componente hijo.

-->@Output

Nos permite enviar información del componente hijo hacia el componente padre.