0

Estoy creando una aplicación con ionic y me aparece el siguiente error al tratar de listar:

ERROR Error: Error trying to diff '[object Object]'. Only arrays and iterables are allowed

Alguien sabe porque aparece?

Html

<ion-content>
    <div class="row header">
      <div class="col">Codigo</div>
      <div class="col">Nombre</div>
      <div class="col">Descripcion</div>
      <div class="col">Cantidad</div>
      <div class="col"></div>
    </div>
    <div class="row" *ngFor="let p of posts">
    <ion-item>
      <div class="col">{{p.codigo}}</div>
      <div class="col">{{p.nombre}}</div>
      <div class="col">{{p.desc}}</div>
      <div class="col">{{p.cantidad}}</div>
    </ion-item>
    </div>
  </ion-content>

Typescript

    import { Component} from '@angular/core';
    import { IonicPage, NavController, NavParams } from 'ionic-angular';
    import { FormBuilder } from "@angular/forms";
    import { PostService } from '../../services/post.services';
    import { NgForm } from '@angular/forms';
    import { Post } from '../../model/post';

export class GmaterialesPage {

posts : Array<Post> = [];

    constructor(public navCtrl: NavController, public navParams: NavParams,
         public formBuilder : FormBuilder,public postService: PostService) {

          }

        ngOnInit() {
            this.getPostList();
          }

        getPostList() {
                this.postService.getPost()
          .subscribe(res => {
            this.posts = res;
          });
              }
}

Servicio

    import { Injectable } from '@angular/core';
    import { HttpClient } from '@angular/common/http';
    import { Post } from '../model/post';
    import { Observable } from 'rxjs/Observable';

    @Injectable()
    export class PostService {

      selectedPost: Post;



      URL_API = 'http://localhost:3000/api/posts';

      constructor(public http: HttpClient) {
        this.selectedPost = new Post();
      }

      getPost(): Observable<Array<Post>>{
    return this.http.get<Array<Post>>(this.URL_API);
  }

Modelo

export class Post {

    constructor(_id = '', codigo = '', nombre = '', desc = '', categoria = '' ,cantidad = 0) {
        this._id = _id;
        this.codigo = codigo;
        this.nombre = nombre;
        this.desc = desc;
        this.categoria = categoria;
        this.cantidad = cantidad;
    }

    _id: string;
    codigo: string;
    nombre: string;
    desc: string;
    categoria:String;
    cantidad: number;
}

1 respuesta 1

0

Muy buenas, tengo un código similar funcionando ahora mismo. Prueba con:

TS:

posts : Post[];

...
getPostList() {
  this.postService.obtenerPosts().subscribe(
    res=>{this.posts=res; console.log('getPostList()', res);},
    err=>console.log('Error', err));
}

Service:

obtenerPosts():Observable<Post[]>{
    return this.http.get(this.URL_API);
  }

Comprueba que imprime exactamente.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Formula una pregunta

Explore related questions

See similar questions with these tags.