how to extract particular value from JSON in typescript

Question

I want to extract only 'phaseValue' part from below json and store that into array.

{  
   "templateName":"TemplateExample",
   "phaseExecutions":{  
      "PRE":[  
         {  
            "phaseType":"text",
            "phaseValue":"enter your name"
         },
         {  
            "phaseType":"number",
            "phaseValue":"enter your mobile number"
         },
         {  
            "phaseType":"email",
            "phaseValue":"enter your email"
         }
      ]
   }
}

Above data I am getting from below code

getTemplateByName():any
{


    this.httpService.get('http://localhost:57611/Api/Employee/GetTemplateByName/'+this.selectedTemplate).subscribe(  
          data => {  
           this.templateInJsonFormat = data;   
           this.getTemplateFromSubscribe(this.templateInJsonFormat);
          }
       );
    }

    getTemplateFromSubscribe(temp:any)
    {
         this.finalTemplateFromSubscribe = temp;  
         console.log(this.finalTemplateFromSubscribe);    
    }

I am using typescript 3.5.3. Please help.

use map function developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… — Madhawa Priyashantha
– Madhawa Priyashantha, Commented Nov 7, 2019 at 7:26

Vlad Vidac · Accepted Answer · 2019-11-07 07:26:54Z

6

const arr = object.phaseExecutions.PRE.map(item => item.phaseValue)

answered Nov 7, 2019 at 7:26

Vlad Vidac

9981 gold badge10 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Abhi Over a year ago

Please have a look at updated code in my question.I am getting that json data from api.

Vlad Vidac Over a year ago

Yes, this can be applied anywhere regardless of specific implementation and code organization.

Patricio Vargas · Accepted Answer · 2019-11-07 07:30:48Z

5

Live demo: https://stackblitz.com/edit/typescript-m9nv6q

const data = 
{  
   "templateName":"TemplateExample",
   "phaseExecutions":{  
      "PRE":[  
         {  
            "phaseType":"text",
            "phaseValue":"enter your name"
         },
         {  
            "phaseType":"number",
            "phaseValue":"enter your mobile number"
         },
         {  
            "phaseType":"email",
            "phaseValue":"enter your email"
         }
      ]
   }
}

const arr = data.phaseExecutions.PRE.map(p=>p.phaseValue);

I recommend you to take a look to the .map() documentation here:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

answered Nov 7, 2019 at 7:30

Patricio Vargas

5,60014 gold badges57 silver badges107 bronze badges

1 Comment

Abhi Over a year ago

Please have a look at updated code in my question.I am getting that json data from api.

Cheshta Pandya · Accepted Answer · 2019-11-07 07:37:22Z

5

obj = {  
   "templateName":"TemplateExample",
   "phaseExecutions":{  
      "PRE":[  
         {  
            "phaseType":"text",
            "phaseValue":"enter your name"
         },
         {  
            "phaseType":"number",
            "phaseValue":"enter your mobile number"
         },enter code here
         {  
            "phaseType":"email",
            "phaseValue":"enter your email"
         }
      ]
   }
}

var phaseValueArr = obj.phaseExecutions.PRE.map(x => x.phaseValue);

phaseValueArr is the required array

answered Nov 7, 2019 at 7:37

Cheshta Pandya

613 bronze badges

1 Comment

Abhi Over a year ago

Please have a look at updated code in my question.I am getting that json data from api.

Adrita Sharma · Accepted Answer · 2019-11-07 09:03:35Z

4

Try like this:

Working Demo

result = []

 this.httpService
  .get(
    "http://localhost:57611/Api/Employee/GetTemplateByName/" +
      this.selectedTemplate
  )
  .subscribe(data => {
    this.templateInJsonFormat = data;
    this.result = this.templateInJsonFormat.phaseExecutions.PRE.map(x => x.phaseValue)
    this.getTemplateFromSubscribe(this.templateInJsonFormat);
  });

edited Nov 7, 2019 at 9:03

answered Nov 7, 2019 at 7:27

Adrita Sharma

22.3k11 gold badges75 silver badges85 bronze badges

4 Comments

Abhi Over a year ago

Please have a look at updated code in my question.I am getting that json data from api.

Adrita Sharma Over a year ago

Check the modified answer

Abhi Over a year ago

It is showing error: [ts] Property 'phaseExecutions' does not exist on type 'Object'.

Adrita Sharma Over a year ago

Check the modified answer

Collectives™ on Stack Overflow

how to extract particular value from JSON in typescript

4 Answers 4

2 Comments

1 Comment

1 Comment

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

1 Comment

1 Comment

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related