Функция Typescript .push добавляет пустой объект в мой массив

Question

Когда я помещаю массив в ngx-barchart, функция push добавляет пустой объект к диаграмме.Я перебираю сервис API и получаю следующее:

Затем я вызываю службу в barchart.component.ts

  single: any = [
    {
      "name": [],
      "value": []
    }      
  ];

функция для нажатия:

getChartData() { 
    this.storageService.barChart.subscribe(barChart=> {if(barChart) 
        barChart.forEach((i) => {         
          // this.single[0].push({name: (i.skill_name), value: (i.score)})          
          this.single.push({name: (i.skill_name), value: (i.score)});
      });
      this.single=[...this.single];
      console.log(this.single)
    });      
  };

Я ожидаю, что пустой объект не будет передан в данные моего графика.

Я пытался добавить:

this.single[0].push({name: (i.skill_name), value: (i.score)})

Но я получаю ОШИБКУ TypeError: _this.single [0] .push не является функцией

Answer 1

this.single[0] это объект не массив

Вы можете попробовать:

this.single[0].name = i.skill_name;
this.single[0].value= i.score;

Answer 2

Я ожидаю, что пустой объект не будет передан в данные моего графика.

Тогда не создавайте один с самого начала, это пустой, который у вас есть в ваших данных.

Вместо:

single: any = [
  {
    "name": [],
    "value": []
  }      
];

просто:

single: any = [];

---

Примечание 1: Я бы вообще не использовал здесь push, если только вы не хотите добавлять все больше и больше данных в this.single. Если вы хотите заменять this.single каждый раз, я использовал бы map:

this.single = (barChart || []).map(({skill: {score: value, name}}) => ({name, value}));
// (And no `this.single = [...this.single];` afterward, it's not needed)

---

Примечание 2: поскольку это TypeScript, вы можете воспользоваться типом для этих данных:

interface ChartDataEntry {
    name: string;
    value: number; // If it's a number
}

затем

single: ChartDataEntry[] = [];

строка this.single = ... не изменяется, TypeScript может определить тип записей, возвращаемых map, и может видеть, что они действительны для этого интерфейса.

Или, если хотите, вместо объявления интерфейса вы можете просто объявить тип записей, встроенный в single:

let single: {name: string, value: number}[] = [];

но наличие объявленного типа обычно полезно, потому что вы можете обнаружить, что хотите использовать его в другом месте того же кода.