Search code examples
node.jsangularapiangular7

Access to a JSON Value in Angular 7


Hello I'm trying to access to an especific key from a JSON. I'm using node.js and angular 7 The JSON I got is stringfy and it comes from an API.

This is the JSON I got

  "search": {
    "entry": [
      {
        "dn": "uid=080030781,c=mx,ou=s,o=i.com",
        "attribute": [
          { "name": "mail", "value": ["CAMILA.CAMPOS.TELLEZ@mail.com", "MX08@mail.com"] }]
      }
    ],
      "return": {
      "code": 0,
        "message": "Success",
          "count": 1
    }
  }
}

I need to access to the key "value", because I need to get the value "camila.campos.tellez@mail.com". I get the JSON from an API declarated in a node.js file called app.js, then I catch the response from it using this service.ts file

 getApproverMail(name) {
    console.log('entered to rootservice');
    return this.http.get(this.baseUrl + '/costing/operations?name=' + name);
  }

Finally I can access to this through a component.ts fil with this code

findApproverMail() {

    this.rootService.getApproverMail(this.aproverName).subscribe((res) => {
      this.email = res;
      console.log('Test: ' + res);
    });

  }

And the browser console prints the JSON I have show you. But how can I access only to the mail's value? P.D I need only the mail because after I got it the web site needs to send an email to that direction


Solution

  • JSON stands for JavaScript Object Notation. Any valid JSON is an object in JavaScript (and TypeScript). You can use dot notation to navigate into the object:

    findApproverMail() {
    
        this.rootService.getApproverMail(this.aproverName).subscribe((res) => {
          this.email = res.search.entry[0].attribute[0].value[0];
          console.log('Test: ' + res);
        });
    
      }
    

    I would recommend defining an interface in the shape of what you expect from the service. It's cleaner than just indexing around an any typed object.

    Also note that I hard code 0 indexes because that answers your question. You might consider a more dynamic / flexible way to get the address or elements you need.