Create single Array that contains values of objects sent from parent component

Question

Hi I need to create in angular single array that contains values of objects sent from parent component

objects sent from parent console.log('object',o):

object {type: "TRA", designator: "EPTR130B", availabilities: Array(1), info: Array(2), geometry: {…}}
object {type: "TRA", designator: "EPTR130A", availabilities: Array(1), info: Array(2), geometry: {…}}
object {type: "TRA", designator: "EPTR25", availabilities: Array(1), info: Array(2), geometry: {…}}
...etc

passing it to child component with:

this.dataSend.emit(object.designator);

reciving data in child:

if (this.dataSend) {
    this.dataSend
    .subscribe(data => {
        console.log(data);
    });
} 

console.log(data):
EPTR130B
EPTR130A
EPTR25
...etc

How I supposed to do it to receive array like [ EPTR130B, EPTR130A, EPTR25...]? map? push?

EDIT: I made some change and passed data as an object to the child with this.dataSend.emit({data}); and receive:

{data: Array(63)}
data: Array(63)
0: {type: "ADHOC", designator: "UAV1", availabilities: Array(1), info: Array(2), geometry: {…}}
1: {type: "TRA", designator: "EPTR130B", availabilities: Array(1), info: Array(2), geometry: {…}}
2: {type: "TRA", designator: "EPTR130A", availabilities: Array(1), info: Array(2), geometry: {…}} ...etc

Might be of use: https://stackoverflow.com/a/45039140/38522 – Ben Aston Feb 26 '20 at 19:12 — Ben Aston, Feb 26 '20 at 19:12
I been trying to do it this way, no result. – Chrobry Feb 27 '20 at 09:47 — Chrobry, Feb 27 '20 at 09:47

AliF50 · Answer 1 · 2020-02-27T14:24:13.163

0

You should be able to do it with map of Rxjs and map of array.

Try:

import { filter, map, tap } from 'rxjs/operators'
......
this.dataSend
    .pipe(
       tap((dataArray: any) => console.log(`dataArray before filter: ${dataArray}`)),
       // allow emissions where dataArray is truthy and it has length > 0
       filter((dataArray: any) => !!dataArray && dataArray.length),
       tap((dataArray: any) => console.log(`dataArray after filter: ${dataArray}`)),
       map((dataArray: any) => dataArray.map(data => data.designation)),
     )
    .subscribe(data => {
        console.log(data);
    });

======================= Edit ============================== Use the tap operator for debugging, you can remove the curtain and see what's going on at that point in time with observables.

edited Feb 27 '20 at 14:24

answered Feb 26 '20 at 19:42

AliF50

16,947
1
21
37

This way I receive dataArray.map is not a function – Chrobry Feb 27 '20 at 09:25
Thank you, however it gives me log: `dataArray before filter: [object Object]` – Chrobry Feb 27 '20 at 15:52
Unfortunately not, `console.log('check',data);` even "check" string is not displayed in console.. – Chrobry Feb 27 '20 at 17:31

score 0 · Accepted Answer · answered Feb 27 '20 at 17:16

I've been trying couple of things, and I don't know if its clean way of operating on arrays and objects but it works:

.subscribe(data => {
    console.log(data);
    let arr: any[]  = [];
    Object.keys(data).forEach(function(item) {
        for(let i=0; i<data[item].length; i++){
            arr.push(data[item][i].designator);
        }
        console.log(arr);
    });
});

Create single Array that contains values of objects sent from parent component

2 Answers2