Chartjs-Ngx-charts-advanced-pie-chart is reading my rest api response as null

by

0👍

✅

@Maaroufi Aziz, Chart changes will be reflected when single object reference will change. So to reload chart based on API changes you need to update your method as below,

  getListComProductSemestre2(){
    this.contratService.getCAProduct("Lunette", "2020", "Semestre_2")
    .subscribe(
      data => {
              this.single.find(s=> s.name==='Semestre 2').value = data;
              this.single = [...this.single];
      },
      error => {
        console.log(error);
      }
    );
  }

I have created sample stackblitz here, here I have used setTimeout for generating Async scenario.

Let me know if you have any doubts.

0👍

In Javascript primitive types are saved by value, not by reference. So when you set initial value of single array at the top of the class, you get the following array of objects:

[
    {
      name: 'Semestre 1',
      value: 894,
    },
    {
      name: 'Semestre 2',
      value: 0,
    }
];

If you want to update value property, you have to find proper object in array and set it’s property with new value.

const obj = single.filter(item => item.name === 'Semestre 2'); // it would be better to use id
obj.value = newValue;

Leave a comment