chart.js label 带if语句

Question

出于翻译目的，我正在尝试根据 html 标签文本设置我的 chart.js 标签。 作为 javascript 的初学者，这有点挑战。

这是我正在尝试做的事情：

html 代码：

<div class="col-lg-6">
  <div id='tag4' class="card-footer small text-muted">{% trans 'ITEMS IN DIFFICULTY' %}</div>
  <div class="bar-chart block">
    <canvas id="myChart3" height="175"></canvas>
  </div>

和我的 chart.js 代码：

var myChart3 = new Chart(ctx3, {
  type: 'bar',
  data: {
    labels: labels3,
    datasets: [{
      label: if (document.getElementById('tag4').value == 'ITEMS IN DIFFICULTY') {
        'low performing items (quantity sold/week)'
      }
      else {
        'references en difficulté (quantité vendu/semaine)'
      },
      data: defaultData3,
      backgroundColor: [
        'rgba(255, 99, 132, 0.2)',
      ],
      borderColor: [
        'rgba(255, 99, 132, 1)',
      ],
      borderWidth: 1
    }],
    options: {
      scales: {
        yAxes: [{
          gridLines: {
            drawOnChartArea: false,
            ticks: {
              beginAtZero: true
            }
          }
        }],
      }
    }
  }
})

结果是图表没有显示出来。 我不确定问题是因为我的 if 语句有问题，还是不能使用 chart.js 标签完成。 任何帮助都非常受欢迎！

Answer 1

你需要的是一个三元运算符，它的工作原理是这样的：

let isTrue = true
let a = isTrue ? 1 : 0

如果isTrue为真，则a为 1，如果为假，则a为 0

在您的情况下，您可以将以下内容作为 label 传递：

document.getElementById('tag4').textContent == 'ITEMS IN DIFFICULTY' ? 'label if true' : 'label if false'