HOWTO · Angular

Analyser JSON en Angular

Ce tutoriel montre comment analyser JSON dans Angular.

Cet article abordera comment analyser JSON dans Angular avec des exemples.

Analyser JSON en Angular

Lorsque nous travaillons avec des API dans des applications Angulars, nous rencontrons des réponses en JSON. Il se peut que nous obtenions des données de l’API au format JSON et que nous ayons besoin de les afficher dans un tableau.

Pour cela, nous devons analyser les données JSON. Prenons un exemple et essayons de créer des données JSON en utilisant la méthode stringify de JSON.

Cette méthode est utilisée pour convertir n’importe quoi au format JSON. Ensuite, nous pouvons utiliser ce JSON pour analyser à l’aide d’une autre méthode de JSON parse().

La méthode parse() peut analyser JSON sans aucun problème.

Exemple de code :

# 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);
  }
}

Production:

analyse des données json en Angular

Avec l’aide de stringify(), nous pouvons convertir les données en un JSON parfait, puis nous pouvons utiliser une autre fonction de JSON parse() qui peut analyser les données JSON sans aucun problème.