Angular http get data and put the json object to a variable

Question

I want to get the nested data in officeid id , code ,name ,shortname, accroym . and put it into individual variable.

How to I do that ???

My code:

{
  "id": 1,
  "code": "1000-001-1-01-001-001",
  "name": "PEACE AND ORDER PROGRAM",
  "isActive": true,
  "majorFinalOutput": null,

  "officeId": 1,

"office": {
  "id": 1,
  "code": "1-01-001",
  "name": "Office of the Governor",
  "shortName": "PGO",
  "accronym": "PGO",
  "website": null,
  "email": null,
  "telephone": null,
  "fax": null,
  "type": "1"
},

 "sectorId": 1,

"sector": {
  "id": 1,
  "name": "General Public Services Sector",
  "code": "1000",
  "parentId": null,
  "parent": null
},

  "dateCreated": "2018-10-02T14:23:04.913",
  "dateModified": null,
  "createdBy": null,
  "modifiedBy": null
}

 getProgram() {
     return this.httpClient.get('api/programs/' + idhold).subscribe((holdprogram: any[]) => {
    console.log(holdprogram);
    });

  return this.programService.editProgram().finally( () => {

  }).subscribe((holdprogram: any[]) => {
    console.log(holdprogram);
    console.log(holdprogram.office.id);
    console.log(holdprogram.office.name);
    console.log(holdprogram.office.shortname);
  }, error => {
    console.error(error);
  },
  () => {
  });
}

Answer 1

The usual simplest way to keep a reference to a variable obtained via a request is to use a component variable :

in the component :

public export class MyComponent {
    ...
    public office: any; // instead of using 'any', you could create an interface corresponding to the structure

    ...
}

in the subscribe :

.subscribe((holdprogram: any[]) => {
    this.office = holdprogram.office;
    console.log(this.office);
    // now this.office keeps a reference of your nested variable 'office'.
}, 

If you need to keep a reference for it across components, it's a bit more comlicated : you could do something similar at the service level (using tap and a local variable), and you'll need to add some more "cache handling" mechanism.