Comunicando componentes en Angular

 Por muchos lados se maneja esta información, por lo que no es nueva. Simplemente es un ejemplo más de referente a ello.

Estoy en un proceso de mejora continua donde como desarrollador sé hacer las cosas, estudio el código del proyecto al que me integro y aprendo a realizar las tareas. El asunto es que no se aprende de forma empírica, de tal forma que se sabe qué hacer aunque no el trasfondo.

Bueno, para no ahondar más...

Tengo un componente "miembros-list", este componente tiene una propiedad llamada "miembros" e implementa la clase OnInit para hacer uso de este hook. De tal forma que al iniciarse, se llena la variable con una lista de elementos, donde cada elemento se forma por los atributos: id, nombre y clase.

En la parte de la plantilla del componente hago uso de un *ngFor para recorrer la lista y se genera una instancia del componente "rpg-miembro" a la cual le paso a sus propiedades Id, nombre y clase los valores correspondientes. Para lograr esto, en el componente rpg-miembro defino las propiedades id, nombre y clase como de entrada mediante la instrucción @Input(), tengo otras propiedades definidas como @Output(). Adicionalmente definí tres funciones: addExperiencia que agrega experiencia a mi integrante y si aplica incrementa el nivel, addArma que agrega un arma y modifica puntos de ataque y certeza, y addArmadura que agrega una protección al integrante y le actualiza los puntos de defensa y evasión.

addArma asigna nombre y tipo a la propiedad "arma" de tipo ArmaComponent e invoca a la función ngOnChanges() de este componente hijo para establecer los puntos que agregará a "ataque" y "certeza".

addArmadura hace lo propio pero utilizando un arreglo de protecciones.

Lo interesante viene a continuación: comunicar una colección de enemigos con la colección de miembros para que traben combate. Creo que para esta parte comunicaré componentes que están al mismo nivel pero en distintos lugares.