ccc

Pasar parámetros de componentes padres a hijo con input

HTML del componente padre: <!-- se ponen entre corchetes las variables q se pasan al empleado hijo-->
<app-list-empleados *ngFor="let empleado of arrEmpleados; let i=index" [empleadoAux]="empleado" [indice]="i">
</app-list-empleados>

En app\list-empleados\list-empleados.component.ts dentro de la clase:
/* especificar en el Input los parámetros q se pasan desde el componente padre */
@Input() empleadoAux:Empleado;
@Input() indice:number;

En html de app\list-empleados\list-empleados.component.html:
{{ indice+1 }} {{ empleadoAux.nombre }}

Inciso: Normalmente el Visual Studio Code te añade automáticamente las librerías de Input y de los modelos a usar según lo has escrito pero si no fuera así hay que poner en el list-empleados.component.ts:
import { Component, Input, OnInit } from '@angular/core';
import { Empleado } from '../empleado.model';

No hay comentarios:

Publicar un comentario