unable to fetch data using ngFor in Angular component

Question

I am trying to show the data in div using ngFor it showing supporting object error and i am passing the data in ID format.

Data are not showing in frontend but in console getting data without any errors.

<div *ngFor="let item of status_history">
    <span>{{item?.data?.invoice_status?.data?.status}}</span>
</div>

 status_history: any = [];

constructer(){

this._activatedRoute.params.forEach((params: Params) => {
  this.invoice_id = params['id'];
});
}

ngOnInit() {
  this.getStatusHistory(this.invoice_id);
}

getStatusHistory(id) {
this._httpService.getInvoiceHistoryStatus(id).subscribe((result) => {
  this.status_history = result.data;
  console.log(this.status_history);
});

getInvoiceHistoryStatus(id: string) {
const url = `${API_LIST.INVOICE_V2.HISTORY_STATUS}${id}`;
return this.http.get(url);
}

StPaulis · Accepted Answer · 2020-09-22 08:38:01Z

1

Inside your *ngFor it should be:

<span>{{item?.invoice_status?.data[0]?.status}}</span>

There is no data inside your item

answered Sep 22, 2020 at 8:38

StPaulis

2,9341 gold badge19 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

unable to fetch data using ngFor in Angular component

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related