Boucle via une série d'objet JSON avec *ngFor (Angulaire 4)

Je veux parcourir un tableau d'objets, ce qui est dans mon fichier json.

Json

[
  {
    "name": "Mike",
    "colors": [
      {"name": "blue"},
      {"name": "white"}
    ]
  },

  {
    "name": "Phoebe",
    "colors": [
      {"name": "red"},
      {"name": "yellow"}
    ]
  }
]

html

<div *ngFor="let person of persons">
   <p>{{person.name}}</p> <!-- this works fine-->
   <p *ngFor="let color of person.colors"> <!--I want to list the colors of the person here-->
     {{color.name}}
   </p>
</div>

Je ne peux pas accéder au tableau de couleurs d'une personne. Comment puis-je y parvenir?

Je l'ai déjà regardé ces postes, mais les solutions d'entre eux ne pouvaient pas m'aider:

Angular2 ngFor Itération sur JSON

Angular2 - *ngFor /boucle d'objet json avec le tableau

  • let la couleur de la personne.couleurs. Le vote de fermer faute de frappe.
  • Double Possible de stackoverflow.com/q/988363/3993662
  • désolé j'ai oublié dans mon post ici, mais je l'ai dans mon code, donc ça ne peut pas être le problème
  • Nope, l'ouverture de la console sera immédiatement rendement de l'erreur et la solution de @Pac0
  • Fermer le premier paragraphe. Vérifiez votre console pour les messages d'erreur.
  • Ok, maintenant que votre exemple de code est fixe, nous vous avons montré qu'il n'y a rien de mal dans le code que vous avez indiqué. Le problème réside probablement dans la façon dont vous affectez votre objet à la variable persons . Veuillez ajouter le code nécessaire pour reproduire le problème, (un un minimum de reproductibles exemple ) .

InformationsquelleAutor BlueCat | 2018-01-23