0

Boa Tarde a todos, estou consumindo uma api, porém não consigo exibi-la no meu template, ela esta sendo consumida, aparece no console, porém não consigo no template.

Component :

import { PaisesProvider } from './../../providers/paises/paises';
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  cotacao: string [];
  constructor(public navCtrl: NavController,
              private paisesProvider: PaisesProvider) {


  }

  ionViewDidLoad() {
    this.listaCotacao();  

  }

  listaCotacao() {
    this.paisesProvider.listaPaises()
    .subscribe(data => {
      this.cotacao = data;
      console.log(this.cotacao);

    });
  }
}

Template: 

<ion-header>
  <ion-navbar>
    <ion-title>Home</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

    <ion-item  *ngFor="let c of cotacao">
      Data : {{c.date}} Valor Compra {{c.buy}} Valor Venda {{c.sell}}    
    </ion-item>          

</ion-content>

Aparece o erro :

Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

6
  • Nessa linha Data : {{c.date}} Valor Compra {{c.buy}} Valor Venda {{c.sell}} você está dizendo que no seu array existe um objeto com as propriedades buy, sell e date. Como é a resposta de console.log(this.cotacao);? Talvez basta trocar seu array de cotações para cotacao: string [{ }]}};
    – Marconi
    Commented 31/08/2018 às 18:31
  • Esta assim amigo : {"ticker": {"high": "29399.00000000", "low": "28234.00000000", "vol": "126.05166124", "last": "29000.12224000", "buy": "29000.13024000", "sell": "29282.98250000", "date": 1535741070}} Commented 31/08/2018 às 18:45
  • Notou que isso é um objeto javascript e não um array?
    – Marconi
    Commented 31/08/2018 às 20:51
  • Você está usando TypeScript ou Javascript?
    – Marconi
    Commented 31/08/2018 às 20:52
  • Notei sim. Estou usando TypeScript Commented 31/08/2018 às 20:56

1 Resposta 1

0

Você está dando um *ngFor em alguma resposta que não é um array, é disso que ele está reclamando, ele está vindo como objeto. Se você quiser exibir os campos desse objeto.

No caso dessa response aí que você informou, ele é um objeto, logo não precisa percorrer os valores dele, basta acessá-los diretamente como por exemplo: c.date c.buy e assim por diante.

4
  • Exato, é um array super simples , mas nao consigo exibir. Commented 31/08/2018 às 18:24
  • Segue api: mercadobitcoin.net/api/BTC/ticker . Eu não estou conseguindo exibir no template de jeito nenhum Commented 31/08/2018 às 18:25
  • Ela não parece ser um vetor mas como vou exibi - la no template ? Commented 31/08/2018 às 18:34
  • Nesse caso você não precisa dar um ngFor, basta dar um c.ticker.date c.ticker.buy e assim por diante. Commented 31/08/2018 às 19:28

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .