Acessar objeto json

Olá Renan,

Para fazer a repetição de um elemento no HTML com o Angular, é necessário que esse elemento seja um Array. Se o JSON que você estiver recebendo de resposta for um Objeto, seus elementos devem ser colocados manualmente na tela.

Porém, respondendo a sua pergunta: Vamos supor que temos um sistema para identicar os alunos de uma escola e as notas que eles tiraram em determinadas matérias.

O que for retornado da requisição é incluído em um 'Array de alunos':

alunos = [
    { nome: "Aluno 1", ano: "2017", notas: [
      { materia: "Matematica", nota: 10 },
      { materia: "Portugues", nota: 9 },
      { materia: "História", nota: 8 }
    ]},
    { nome: "Aluno 2", ano: "2017", notas: [
      { materia: "Matematica", nota: 10 },
      { materia: "Portugues", nota: 9 },
      { materia: "História", nota: 8 }
    ]},
    { nome: "Aluno 3", ano: "2017", notas: [
      { materia: "Matematica", nota: 10 },
      { materia: "Portugues", nota: 9 },
      { materia: "História", nota: 8 }
    ]}
  ];

E então é possível fazer a iteração pelos elemntos no HTML com o *ngFor dessa maneira:

<ul *ngFor="let aluno of alunos">
  <li>{{ aluno.nome }}</li>
  <li *ngFor="let nota of aluno.notas">{{ nota.materia }} - {{ nota.nota }}</li>
</ul>

Espero ter ajudado \\//_

Bom dia princila.

Eu entendi oque voce disse, porem eu nao tiver sucesso. Meu codigo esta assim:

HTML

<ion-content padding>
  <ion-grid>

            <ion-row wrap >

              <ion-col col-6>{{postData.codigoRetorno}}</ion-col>
              <ion-col col-6>b</ion-col>
              <ion-col col-6>c</ion-col>
              <ion-col col-6>d</ion-col>
              <ion-col col-3><button ion-button small color="danger" (click)="onTestPost(postData)"> Details</button>
              <p>retorno: {{postData.vendas}}</p>
              </ion-col>
            </ion-row>
          </ion-grid>



</ion-content>

O codigo acima funcina normal. Na linha 17 onde esta escrito:

<ion-col col-6>{{postData.codigoRetorno}}</ion-col>

Ele retorna a MSG: MSG001 de acordo com oque retorna no JSON:

codigoRetorno
:
"MSG_001"

Porem quando eu tenta pegar alguma informação que esta dentro do vendas dentro do mesmo json na linha 21 e 22:

<ion-col col-3><button ion-button small color="danger" (click)="onTestPost(postData)"> Details</button>
              <p>retorno: {{postData.vendas}}</p>

ele retorna assim:

[object Object],[object Object],
[object Object],[object Object],
[object Object],[object Object],
...

json:

vendas
:
[{nsuOrigem: null, nsuAdministradora: "248124790", nrAutorizacao: "041992", redeAdquirente: 2,…},…]
0
:
{nsuOrigem: null, nsuAdministradora: "248124790", nrAutorizacao: "041992", redeAdquirente: 2,…}
1
:
{nsuOrigem: null, nsuAdministradora: "247585300", nrAutorizacao: "009498", redeAdquirente: 2,…}
2
:
{nsuOrigem: null, nsuAdministradora: "3365860", nrAutorizacao: "008096", redeAdquirente: 2,…}
3
:
{nsuOrigem: null, nsuAdministradora: "247574304", nrAutorizacao: "084662", redeAdquirente: 2,…}

E eu queria retorna o valor que esta dentro de vendas

Renan, o problema é que você ta querendo mostrar diretamente um array de objetos com expressions ( {{ }} ), e ele não é capaz disso, e acaba mostrando somente que existe algo do tipo [object Object] para ser imprimido ai.

Se você quiser simplesmente ver o que ta vindo do JSON, como um json com chave e valor, você pode utilizar um Pipe do Angular chamado JsonPipe (https://v2.angular.io/docs/ts/latest/api/common/index/JsonPipe-pipe.html):

{{ postData.vendas | json }}

Já se você quiser listar todos os elementos individualmente, você precisa iterar pelos elementos no array e ir iterando por seus atributos. Poderia fazer algo como:

<ion-content>
  <ion-item-group *ngFor="let venda of postData.vendas">
    <ion-item>{{ venda.nsuOrigem }}</ion-item>
    <ion-item>{{ venda.nsuAdministradora }}</ion-item>
    <ion-item>{{ venda.nrAutorizacao }}</ion-item>
    ...
  </ion-item-group>
</ion-content>

Priscila deu certo...

Vlw muito obrigado.