Parsen von JSON in Angular

Dieser Artikel befasst sich anhand von Beispielen mit dem Parsen von JSON in Angular.

Parsen von JSON in Angular

Bei der Arbeit mit APIs in Angular-Anwendungen stoßen wir auf Antworten in JSON. Möglicherweise erhalten wir einige Daten von der API im JSON-Format und müssen sie möglicherweise in einer Tabelle anzeigen.

Dazu müssen wir die JSON-Daten parsen. Lassen Sie uns ein Beispiel haben und versuchen, JSON-Daten mit der stringify-Methode von JSON zu erstellen.

Diese Methode wird verwendet, um alles in das JSON-Format zu konvertieren. Dann können wir diesen JSON verwenden, um mit Hilfe einer anderen JSON-Methode parse() zu parsen.

Die Methode parse() kann JSON problemlos parsen.

Beispielcode:

# Angular
import { Component, VERSION, OnInit } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent implements OnInit {
  strInfo: any;
  parseInfo: any;

  myInfo =
    {
      "id": 0,
      "guid": "9b06a996-23f4-46ff-a007-a6bca1f9c1f3",
      "balance": "$1,590.37",
      "age": 33,
      "name": "Chaney Harrell",
      "gender": "male",
      "company": "GOGOL",
      "email": "chaneyharrell@gogol.com",
      "phone": "+1 (836) 566-3872",
      "address": "716 Grafton Street, Rodanthe, West Virginia, 6757"
    }

  ngOnInit() {
    console.log(this.myInfo);

    this.strInfo = JSON.stringify(this.myInfo);
    console.log('After using Stringify :', this.strInfo);

    this.parseInfo = JSON.parse(this.strInfo);
    console.log('After Parsing Json Info:', this.parseInfo);
  }
}

Ausgabe:

Mit Hilfe von stringify() können wir die Daten in ein perfektes JSON umwandeln, und dann können wir eine andere Funktion von JSON parse() verwenden, die die JSON-Daten problemlos parsen kann.