Angular动态设置柱状图数据和标签时报undefined错误如何解决？

你初始化barChartData时为空数组，未在对应下标位置提前创建符合ChartDataSets结构的对象，直接访问this.barChartData[下标]返回值为undefined，给undefined设置label属性就会触发该报错。

public barChartData: ChartDataSets[] = [];
public numType = 0;

for (let index = 0; index < this.tag.length; index++) {
  if(this.tag[index].type == 'type')
  {
    // 先追加符合结构的初始化对象
    this.barChartData.push({
      label: this.tag[index].name,
      data: []
    });
    // 操作刚插入的对象写入数据
    this.barChartData[this.barChartData.length - 1].data.push(2);
    this.numType++;
  }
}

• 移除了冗余的手动计数变量barChartDataCount，直接用数组原生push方法追加元素，避免手动维护索引出现的错位问题
• 每次命中过滤条件时，先向数组插入完整初始化的ChartDataSets结构对象，包含空data数组和对应label值，再操作数据插入
• 如果运行环境支持ES2022及以上语法，可以用this.barChartData.at(-1)替代this.barChartData[this.barChartData.length - 1]获取刚插入的元素，写法更简洁

内容的提问来源于stack exchange，提问作者ander99