title: How do I use my chart.js line chart with handlebars?
body: <p>I'm learning Handlebars and now trying to implement a line chart from chartjs library with handlebar but I am unable to figure out also there's no tutorial or guide for this topic. Here is my code if I try this without handlebars and static data it works but with handlebars it's not even showing my line chart.</p>
  <p><strong>This is my template.html</strong></p>
  <pre><code>&lt;script id=&quot;lineChart&quot; type=&quot;text/x-handlebars-template&quot;&gt;
  &lt;div class=&quot;row&quot;&gt;
    &lt;div class=&quot;col-sm-12 col-md-2&quot;&gt; &lt;/div&gt;
      &lt;div class=&quot;col-sm-12 col-md-8&quot;&gt; 
        &lt;canvas id=&quot;myChart&quot; width=&quot;400&quot; height=&quot;400&quot;&gt;&lt;/canvas&gt;
    &lt;/div&gt;
    &lt;/div&gt;
  &lt;script&gt;
  var ctx = document.getElementById('myChart').getContext('2d');
  var lineChart = new Chart(ctx, {
     type: 'line',
     data: {
        labels:  {{chartData.Date}} //[&quot;08/05/2020&quot;, &quot;08/06/2020&quot;, &quot;08/07/2020&quot;, &quot;08/08/2020&quot;],
        datasets: [
          {
            label: &quot;Order Amount&quot;,
            fill: false,
            lineTension: 0,
            borderColor: &quot;#0d6efd&quot;,
            data:  {{chartData.Data}}  //[1500,2100, 3580, 2800],
          }
        ]
     } 
  });
  &lt;/script&gt;
  &lt;/script&gt;
  </code></pre>
  <p><strong>This is handlebars app.js</strong></p>
  <pre><code>const chartData = {
      Dates:[&quot;05/08/2020&quot;, &quot;05/09/2020&quot;, &quot;05/10/2020&quot;],
      Data: [1500, 1200, 1750]
  };
  
  let lineChart = $('#lineChart').html();
  let lineChartScript = Handlebars.compile(lineChart);
  let linehtml = lineChartScript(chartData);
  $(document.body).append(linehtml);
  </code></pre>