View api with Ionic

Question

Good afternoon to everyone, I am consuming an api, but I can not display it in my template, it is consumed, appears on the console, but I can not in the 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>

Error appears :

Cannot find a differ supporting Object '[Object Object]' of type 'Object'. Ngfor only Supports Binding to Iterables such as Arrays.

Answer 1

You’re giving a *ngFor in some answer that is not an array, that is what it is complaining about, it is coming as an object. If you want to display the fields of that object.

In the case of this Answer there that you reported, it is an object, so you do not need to go through its values, just access them directly as for example: c.date c.buy and so on.