error message Can not find a different supporting object '[object Object]' of type 'object'. NgFor only

Question

error message Can not find a different supporting object '[object Object]' of type 'object'. NgFor only

Navigation

#1 by (0 votes)
#2 by (0 votes)
#3 by (0 votes)

0

I'm having this error message;

Thisindicatesthattheerrorishere;

<!--INíCIOdoCONTEÚDO--><sectionclass="content-header">
  <h1>
    Todos os Restaurantes
  </h1>
</section>


<section class="content">

  <div class="row">
        <div *ngFor="let restaurant of restaurants" class="col-sm-6 col-xs-12">

          <mt-restaurant [restaurant]="restaurant"></mt-restaurant>

        </div>
  </div>
</section>

This is my class of services;

@Injectable()
export class RestaurantService {
  public url: String = 'http://localhost:3000/api/';

  constructor(private http: Http) {
  //  this.url = environment.url;
   }

   restaurants(): Observable<Restaurant[]> {
    return this.http.get('${this.url}/restaurants')
    .map(response => response.json())
  }

And this is my component class;

  restaurants: Restaurant[]

  constructor(private restaurantService: RestaurantService){}

  ngOnInit() {
    this.restaurantService.restaurants()
    .subscribe(restaurants =>  this.restaurants = restaurants)
  }

What can be wrong?

angular

asked by anonymous 29.06.2018 / 15:57

3 answers

Doubt to handle specific date filter (Qlik View) Select from cursor

score 0 · Answer 1

You are passing "restaurant" and not "restaurants" which is your array.

<mt-restaurant [restaurant]="restaurant"></mt-restaurant>

Replace with

    <mt-restaurant [restaurant]="restaurants"></mt-restaurant>

score 0 · Answer 2

0

It worked to make this change in the code;

  restaurants(): Observable<Restaurant[]> {
    return this.http.get('${this.url}/restaurants')
    .map(response => response.json().restaurants)
  }

29.06.2018 / 17:36

score 0 · Answer 3

The problem is that ngFor expects an array, and is receiving a Response object. The error is here:

ngOnInit() {
    this.restaurantService.restaurants()
    .subscribe(restaurants =>  this.restaurants = restaurants)
}

You receive the complete Response object, you need to indicate the body of this Response for your restaurants attribute :

ngOnInit() {
    this.restaurantService.restaurants()
    .subscribe(restaurants =>  this.restaurants = restaurants.body)
}

I hope it solves your problem.