angular - Analysera JSON-arrayobjektet från tjänsten i komponenten


Detta är svaret jag skickar från tjänsten till komponenten där jag ska visa varje värde i användargränssnittet. Jag behöver analysera varje värde och lagra det i en variabel.

[{"profileId":"000234","profileName":"kofi prfl","regionName":"NA  ","fileType":"GRRCN","fileVersion":"1.01","fileFreq":"D01","fileFormat":"FIX","emptyFile":"N","cardMask":"Y","uprInd":"N","dataLevel":"01"}]

this.profileDetailsService.getProfileDetails(this.idDisplay)
      .subscribe(profileResponse => {
          // Should parse the profileResponse here....
          this.searchResult = profileResponse;
          this.spinnerService.hide();
        },
      error => {
          this.spinnerService.hide();
          this.showError();
        }
      );

Hur separerar man värden som profileId, profileName, regionName osv.?

Svar #1

istället för i din kod:

...
this.searchResult = profileResponse;
...

du kan använda:

searchResult: any[];

...
this.searchResult = profileResponse.json() || {}
...

då kan du komma åt varje egenskap via sökResultat-item:

this.searchResult[0].profileId, etc

Svar #2

Uppdatering baserad på kommentarkod:

Anledningen till att du inte kan komma åt egenskaperna hos searchResult är att tjänsten returnerar ett svar snarare än ett Javascript-objekt med egenskaper.

Från HTTP Angular-dokumentationen här:

Svarsdata finns i form av JSON-sträng. Appen måste analysera den strängen till JavaScript-objekt genom att anropa response.json().

Jag föreslår att analysera svaret i tjänsten för att hålla saker relaterade till HTTP-förfrågan där och förhindra kodduplicering.

Ändra :

return this.http.post(this._url, body, options).map((response: Response) => {
    return response;
}).catch((error) => {
    return Observable.throw(error);
});

Till detta (om du verkligen bara vill ha den första profilen i arrayen):

 return this.http.post(this._url, body, options).map((response: Response) => {
        return response.json()[0];
    }).catch((error) => {
        return Observable.throw(error);
    });

Den nya koden parsear JSON-objektet och extraherar det första objektet från arrayen med .json()[0]. Byt sedan namn på profileResponse till profileDetails och få åtkomst till this.searchResult-egenskaperna med punktnotation:

t.ex. Från en annan funktion i komponenten: console.log(this.searchResult.profileName)

t.ex. Från din mall: {{searchResult.profileName}}