Estoy usando salidas personalizadas en mi aplicación Angular para enviar valores seleccionados por el usuario entre componentes. En este momento, lo que funciona es que cada vez que un usuario hace clic en un elemento de casilla de verificación, ese valor se envía a mi subcomponente, donde puedo verlo impreso en la consola. El problema es que cuando el usuario hace clic en otra selección, recibo ese valor enviado, pero el valor enviado anterior ahora devuelve indefinido. En otras palabras, solo obtengo el valor más reciente. Mi pregunta es: ¿cómo almaceno esos valores que se transmiten, de modo que pueda crear una lista de filtros con cada uno de los valores seleccionados por el usuario, en lugar de solo el más reciente?

Los valores se pasan al subcomponente con Angular's Output() y EventEmitter(), y se envían a una función "getFilters($event)", como esta:

 <div class="page-content"> <list [records]="records" (sendChange)="getFilters($event)" (sendLanguage)="getFilters($event)" (sendBranch)="getFilters($event)" (sendZipcode)="getFilters($event)"> </list> </div>

He intentado recibir esos valores y luego almacenarlos en variables. Pero cuando registro esas variables en la consola, solo veo la selección más reciente. ¿Cómo puedo almacenar todas las selecciones para poder crear una nueva consulta?

 getFilters(page, language, zipcode, branch) { const paged = page; const lang = language; const zip = zipcode; const city = branch; console.log('Stored: ' + paged + ' ' + lang + ' ' + zip + ' ' + city); }

Entonces, si "código postal" fue el último valor pasado, esto es lo que veo en la consola (todos los demás valores enviados anteriormente ahora están "indefinidos"):

 Stored: 90001 undefined undefined undefined undefined