Need to format array response correctly to take as a input in ngxCsv() in angular

Question

I am receiving response from API in below format.

data = [  
        [
        {
          ColA : "Val1",
          ColB : "Val2",
          ColC : "Val3",
          ColD : ("2019-08-19T06:38:28.990+0000"),  
        }
        ],

        [
        {
          ColA : "Val11",
          ColB : "Val21",
          ColC : "Val31",
          ColD : ("2019-08-19T06:38:28.990+0000"),          
        }
        ],
    
        [
        {
          ColA : "Val12",
          ColB : "Val22",
          ColC : "Val32",
          ColD : ("2019-08-19T06:38:28.990+0000"),          
        }
        ]

];

And I would require the data to be in below format to pass it as a input to ngxCsv() method in angular which takes jsonData as input.

data = [

        {
          ColA : "Val1",
          ColB : "Val2",
          ColC : "Val3",
          ColD : ("2019-08-19T06:38:28.990+0000"),          
        },     
          
        {
          ColA : "Val11",
          ColB : "Val21",
          ColC : "Val31",
          ColD : ("2019-08-19T06:38:28.990+0000"),          
        },
             
        {
          ColA : "Val12",
          ColB : "Val22",
          ColC : "Val32",
          ColD : ("2019-08-19T06:38:28.990+0000"),          
        }

];

Below is my code please let me know how I can achieve the expected result...

Response received:

data = [  
        [
        {
          ColA : "Val1",
          ColB : "Val2",
          ColC : "Val3",
          ColD : ("2019-08-19T06:38:28.990+0000"),  
        }
        ],
        [
        {
          ColA : "Val11",
          ColB : "Val21",
          ColC : "Val31",
          ColD : ("2019-08-19T06:38:28.990+0000"),          
        }
        ],
        [
        {
          ColA : "Val12",
          ColB : "Val22",
          ColC : "Val32",
          ColD : ("2019-08-19T06:38:28.990+0000"),          
        }
        ]

];

regEx function to remove the special characters ("[", "],", "];")

export class specialPipe implements PipeTransform{
                    transform(data: any) {
                    let newValue = data.replace(/[ ], ];/g, "");
                    return newValue;
}

Function created to pass the modified data in an array and download CSV file using ngxCSV()

exportCSVTS(){

           var foo:specialPipe = new specialPipe();
           var newData = foo.transform(this.data);
           let ArrayData: Array<string> = newData;

           var options = {
           title: "CSV File",
           fieldSeparator: ",",
           quoteStrings: '"',
           decimalseparator: ".",
           showLabels: false,
           showTitle: false,
           useBom: false,
           headers: ['ColA','ColB', 'ColC', 'ColD']
}

new ngxCsv(ArrayData , "CSV File", options);
}

Note: if the response data is in expected format (i.e., data = [{}, {}, {}];), then CSV file gets downloaded perfectly with correct data.

To Achieve this, I tried using regEx and tried to pass the response data to remove unnecessary special characters from the received response. Please help me out with this as this is troubling me for a while now.

Thanks & Regards, LuciferTK0797

Khaled Ayed · Answer 1 · 2023-05-10T16:45:16.553

You can use flat() method to flatten sub-arrays:

The flat() method creates a new array with all sub-array elements concatenated into it recursively up to the specified depth.

data = [  
        [
        {
          ColA : "Val1",
          ColB : "Val2",
          ColC : "Val3",
          ColD : ("2019-08-19T06:38:28.990+0000"),  
        }
        ],

        [
        {
          ColA : "Val11",
          ColB : "Val21",
          ColC : "Val31",
          ColD : ("2019-08-19T06:38:28.990+0000"),          
        }
        ],
    
        [
        {
          ColA : "Val12",
          ColB : "Val22",
          ColC : "Val32",
          ColD : ("2019-08-19T06:38:28.990+0000"),          
        }
        ]

];

const newData = data.flat();
console.log(newData);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Thanks... I'll try this. But after this question I made some changes to my API code to receive the input itself in desired format. However, I'll try this method and check again. — LuciferTK0797, May 16 '23 at 07:04

Need to format array response correctly to take as a input in ngxCsv() in angular

1 Answers1