如何从订户内部的外部价值中获取

时间:2019-06-01 15:41:35

标签: angular7

我正在使用chartjs和Angular 7开发仪表板,我需要显示工具提示中来自对象的一些信息。

enter image description here

我能够在控制台日志中获取该对象,但是我不知道如何从函数内部的订户获取值,该值使我可以在屏幕上显示自定义工具提示。

这是我的代码。

ngOnInit() {

this.batches.forEach(batch => {
        let batchID = batch.batch_id;
        this.dashboardService.getBatchId(batchID).subscribe(singleBatch => {
          this.batch = singleBatch;
          console.log(this.batch)
          let batchName = this.batch.name //<-- THIS IS MY VARIABLE
          console.log(batchName)
        })
      })
}

Duration = {
    tooltips: {
      // Disable the on-canvas tooltip
      enabled: false,

      custom: function(tooltipModel) {
          // Tooltip Element
          var tooltipEl = document.getElementById('chartjs-tooltip');

          // Create element on first render
          if (!tooltipEl) {
              tooltipEl = document.createElement('div');
              tooltipEl.id = 'chartjs-tooltip';
              tooltipEl.innerHTML = '<table style="background-color: #eee;"></table>';
              document.body.appendChild(tooltipEl);
          }

          function getBody(bodyItem) {
              return bodyItem.lines;
          }

          // Set Text
          if (tooltipModel.body) {
              var titleLines = tooltipModel.title || [];
              var bodyLines = tooltipModel.body.map(getBody);
              innerHtml += '<tbody>';

              bodyLines.forEach(function(body, i) {
                  var span = '<span>' +
                  '<p>Batch: </p>' + //<----HERE IT IS THE PLACE WHERE I WANT TO PUT BATCHNAME
                  '</span>';
                  innerHtml += '<tr><td>' + span + body + '</td></tr>';
              });
              innerHtml += '</tbody>';
          }
      }

  }
};

提前谢谢。

1 个答案:

答案 0 :(得分:0)

我要使用伪代码,因为我不在开发机器上。

在您的代码中,您已经有一个用于批次的变量,例如this.batches,那么为什么要回到服务中获取批次呢?例如

transition

您只需要一个函数即可显示工具提示,例如

updated fiddle

然后您应该从html调用它

 this.batches.forEach(batch => { console.log(batch.name) });