如何在 angular 甘特图高位图中单击时更改 Y 轴的标签颜色

Question

如何在点击标签时改变Y轴的背景颜色。它在 javascript 上运行良好，但在 angular.

上运行不正常

chart.yAxis[0].labelGroup.element.childNodes.forEach(function (label) {
  label.onclick = function () {
    alert(label.style);
    label.style.fill = "teal";
    let data = chart.series[0].data,
      visibleRows = 0,
      chartHeight;
    data.forEach((el) => {
      if (el.visible) {
        visibleRows++;
      }
    });
    if (visibleRows > 3) {
      alert("if");
      chartHeight = 40 * visibleRows;
    } else {
      alert("else");
      chartHeight = 40 * visibleRows + 110;
    }
    chart.update({
      chart: {
        height: chartHeight
      }
    });
  };
});

https://codepen.io/mehrotrarohit07/pen/PoKxvQp?editors=1010

Answer 1

经过长时间的研究，得到了解决方案。

this.chart.yAxis[0].labelGroup.element.childNodes.forEach(function (label) {
      label.onclick = function () {
        alert(label.style)
        label.style.fill = "teal";
      };
    });
  }

Stackblitz Url https://stackblitz.com/edit/highcharts-angular-gantt-un3avk?file=src%2Fapp%2Fapp.component.ts