CODEWITHSUNDEEP
jsonangularhttpag-grid
Rahat Saini
Rahat Saini

Reputation: 361

How to format the result from http get Request in typescript

I have an angular project in which I am consuming an API that sends the data back in this format. Head is the string that contains all the Keys/Properties separated by ",". I want to display the data in ag-grid 

   {
"Head": "Sample Number,Insurance Type,Insurance Type Name,Quote Description,NVIC,Car Detail,GNAF,Search Address,Gender,Borrowing Amount,Deposit_Amount,Loan_Term,Residual,Own_Property,Credit_Score,Vehicle_Type,Annual_Income,Loan_Type,Loan_Interest_type,Seller_Type,Error Message",
"Items": [
    "1,FCL,Finance Car Loan,Sample,MX313A,,GANT_702976160,,Male,13107,2000,5,0,No,621,Used,73200,Secured,Fixed,Private,NVIC not found.",
    "2,FCL,Finance Car Loan,Sample,N1J13A,,GANT_716848802,,Female,10630,0,5,0,No,512,Used,39600,Secured,Fixed,Private,NVIC not found.",
    "3,FCL,Finance Car Loan,Sample,01JZ18,,GANT_717255160,,Male,11429,2000,5,0,Yes,662,New,64188,Secured,Fixed,Dealer,NVIC not found.",
    "4,FCL,Finance Car Loan,Sample,MWE13A,,GANSW710285256,,Female,14483,3500,4,0,No,350,Used,40800,Secured,Fixed,Private,NVIC not found.",
}

How do I format the response from API like this {property1:value,property2:value....} or is there a way I can use the data in same format for ag-grid

Upvotes: 2

Views: 76

Answers (2)

Vlad B.
Vlad B.

Reputation: 2937

You can try with mighty reduce for example:

let someObject = {
  "Head": "Sample Number,Insurance Type,Insurance Type Name,Quote Description,NVIC,Car Detail,GNAF,Search Address,Gender,Borrowing Amount,Deposit_Amount,Loan_Term,Residual,Own_Property,Credit_Score,Vehicle_Type,Annual_Income,Loan_Type,Loan_Interest_type,Seller_Type,Error Message",
  "Items": [
    "1,FCL,Finance Car Loan,Sample,MX313A,,GANT_702976160,,Male,13107,2000,5,0,No,621,Used,73200,Secured,Fixed,Private,NVIC not found.",
    "2,FCL,Finance Car Loan,Sample,N1J13A,,GANT_716848802,,Female,10630,0,5,0,No,512,Used,39600,Secured,Fixed,Private,NVIC not found.",
    "3,FCL,Finance Car Loan,Sample,01JZ18,,GANT_717255160,,Male,11429,2000,5,0,Yes,662,New,64188,Secured,Fixed,Dealer,NVIC not found.",
    "4,FCL,Finance Car Loan,Sample,MWE13A,,GANSW710285256,,Female,14483,3500,4,0,No,350,Used,40800,Secured,Fixed,Private,NVIC not found.",]
}
someObject.Head = someObject.Head.split(',');
someObject.Items = someObject.Items.map(item => item.split(',')).flat();

let result = someObject.Head.reduce(function (acc, item, i) {
  return Object.assign(acc, { [item]: someObject.Items[i] })
}, {});

console.log(result);

Upvotes: 0

MoxxiManagarm
MoxxiManagarm

Reputation: 9134

Try this

const data = {
      "Head": "Sample Number,Insurance Type,Insurance Type Name,Quote Description,NVIC,Car Detail,GNAF,Search Address,Gender,Borrowing Amount,Deposit_Amount,Loan_Term,Residual,Own_Property,Credit_Score,Vehicle_Type,Annual_Income,Loan_Type,Loan_Interest_type,Seller_Type,Error Message",
      "Items": [
          "1,FCL,Finance Car Loan,Sample,MX313A,,GANT_702976160,,Male,13107,2000,5,0,No,621,Used,73200,Secured,Fixed,Private,NVIC not found.",
          "2,FCL,Finance Car Loan,Sample,N1J13A,,GANT_716848802,,Female,10630,0,5,0,No,512,Used,39600,Secured,Fixed,Private,NVIC not found.",
          "3,FCL,Finance Car Loan,Sample,01JZ18,,GANT_717255160,,Male,11429,2000,5,0,Yes,662,New,64188,Secured,Fixed,Dealer,NVIC not found.",
          "4,FCL,Finance Car Loan,Sample,MWE13A,,GANSW710285256,,Female,14483,3500,4,0,No,350,Used,40800,Secured,Fixed,Private,NVIC not found.",
      ]
    };
const keys: string[] = data.Head.split(',');
const items = data.Items.map(item => lodash.zipObject(keys, item.split(','))); // import * as lodash from 'lodash';

results in items being

[{"Sample Number":"1","Insurance Type":"FCL","Insurance Type Name":"Finance Car Loan","Quote Description":"Sample","NVIC":"MX313A","Car Detail":"","GNAF":"GANT_702976160","Search Address":"","Gender":"Male","Borrowing Amount":"13107","Deposit_Amount":"2000","Loan_Term":"5","Residual":"0","Own_Property":"No","Credit_Score":"621","Vehicle_Type":"Used","Annual_Income":"73200","Loan_Type":"Secured","Loan_Interest_type":"Fixed","Seller_Type":"Private","Error Message":"NVIC not found."},{"Sample Number":"2","Insurance Type":"FCL","Insurance Type Name":"Finance Car Loan","Quote Description":"Sample","NVIC":"N1J13A","Car Detail":"","GNAF":"GANT_716848802","Search Address":"","Gender":"Female","Borrowing Amount":"10630","Deposit_Amount":"0","Loan_Term":"5","Residual":"0","Own_Property":"No","Credit_Score":"512","Vehicle_Type":"Used","Annual_Income":"39600","Loan_Type":"Secured","Loan_Interest_type":"Fixed","Seller_Type":"Private","Error Message":"NVIC not found."},{"Sample Number":"3","Insurance Type":"FCL","Insurance Type Name":"Finance Car Loan","Quote Description":"Sample","NVIC":"01JZ18","Car Detail":"","GNAF":"GANT_717255160","Search Address":"","Gender":"Male","Borrowing Amount":"11429","Deposit_Amount":"2000","Loan_Term":"5","Residual":"0","Own_Property":"Yes","Credit_Score":"662","Vehicle_Type":"New","Annual_Income":"64188","Loan_Type":"Secured","Loan_Interest_type":"Fixed","Seller_Type":"Dealer","Error Message":"NVIC not found."},{"Sample Number":"4","Insurance Type":"FCL","Insurance Type Name":"Finance Car Loan","Quote Description":"Sample","NVIC":"MWE13A","Car Detail":"","GNAF":"GANSW710285256","Search Address":"","Gender":"Female","Borrowing Amount":"14483","Deposit_Amount":"3500","Loan_Term":"4","Residual":"0","Own_Property":"No","Credit_Score":"350","Vehicle_Type":"Used","Annual_Income":"40800","Loan_Type":"Secured","Loan_Interest_type":"Fixed","Seller_Type":"Private","Error Message":"NVIC not found."}]

Upvotes: 1

Related Questions