How to create multi line headers in CSV in Angular?

Question

I am creating an 'Export to CSV' button which will export my Tabular data to.csv file

This is the html for CSV button

<a csvLink class="btn downloadBtn" [headers]="csvHeaders" [data]="csvData">Export to CSV</a>

This is mt typescript for writing csv:

          //CSV File Formating
          //Headers
          //Master Agent
          let csvHead = [];
          for(let service of res.data.retUnderAgt[0].services){
            for(let t of service.txnTypes){
              csvHead.push({label: service.serviceName+" "+t.txnTypeName, key: service.serviceCode+t.txnTypeName})
            }                
          }
          this.csvHeaders = [
            {label:'OrgName',key: 'orgName'},
            ...csvHead,
            {label: 'NGR', key: 'ngr'}
          ]

          //Data
          for(let i of res.data.retUnderAgt){
            let csvDataInner = {} ;
            if(i.orgName){
              csvDataInner['orgName'] = (i.orgName);
            }else if(i.date){}
            else{      
              csvDataInner['orgName'] = "Total";
            }
            for(let j of i.services){
              for(let k of j.txnTypes){
                csvDataInner[j.serviceCode+k.txnTypeName] = (k.amount);
              }
            }
            csvDataInner['ngr']=i.ngr;
            this.csvData.push(csvDataInner)
          } 

And this is what I have so far in csv:

I want this to be in csv:

Answer 1

Alhough logically, 'Master Agents' is a header, you could generate the extra line by adding it to this.csvData before you start the second for -loop:

this.csvData.push({ orgName : 'Master Agents'});