javascript - how to use jadepug conditionals inside a script block? - Stack Overflow

admin管理员组

文章数量:1396763

i'm struggling to get this working. im actually using Chart.js and trying to populate my graphs with arrays of data. so my code looks like

block lower-scripts
script.
    var data = {
        labels : [
            each visit in visitstats
                #{visit.date}, 
        ],

the output i get looks like

<script>var data = {
labels : [
    each visit in visitstats
        04/17/2016, 
],

and i dont think that is right. should it print the each statement out into the html output?

I've tried following a few questions but cant get this working. It doesn't look like the each statement runs. tried using the - to make it run. tried the pipe in front of the js to make it the exception. nothing. can anyone show me where i'm going wrong?

i'm struggling to get this working. im actually using Chart.js and trying to populate my graphs with arrays of data. so my code looks like

block lower-scripts
script.
    var data = {
        labels : [
            each visit in visitstats
                #{visit.date}, 
        ],

the output i get looks like

<script>var data = {
labels : [
    each visit in visitstats
        04/17/2016, 
],

and i dont think that is right. should it print the each statement out into the html output?

I've tried following a few questions but cant get this working. It doesn't look like the each statement runs. tried using the - to make it run. tried the pipe in front of the js to make it the exception. nothing. can anyone show me where i'm going wrong?

• javascript
• node.js
• pug

Share Improve this question Follow asked Apr 28, 2016 at 15:46 bytejunkiebytejunkie 1,0331515 silver badges3030 bronze badges 4

• I usually do this by putting the array or object in a hidden input tag and then when required in frontend js, I get the value of this input tag and parse it. – Mohit Bhardwaj Commented Apr 28, 2016 at 15:53
• clever. do you have an example you could sanitise and put up as an answer? – bytejunkie Commented Apr 28, 2016 at 19:22
• I have also thought it ought to be possible to ajax it into the page on document ready. but my ajax chops aren't up to that right now. – bytejunkie Commented Apr 28, 2016 at 19:43
• why use an extra ajax request that is not required. wait, i'll put my approach as an answer. – Mohit Bhardwaj Commented Apr 29, 2016 at 6:20

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

Put a hidden input tag in your body in jade e.g.

body
  input(type="hidden", id="visit-stats-json", value= JSON.stringify(visitstats) )

  script.
    var visitStatsValue = document.getElementById("visit-stats-json");
    var visitStatsJSON = JSON.parse( visitStatsValue );
    var labelsArray = [];
    for( var i = 0; i < visitStatsJSON.length; i++ )
    {
      var visit = visitStatsJSON[i];
      labelsArray.push( visit.date );
    }//for

    var data = { labels: labelsArray };

Now your data variable should have the value you want.

Edit: I use exactly the same syntax and it works. Please note that there is a space after value=. If it still doesn't work, you can also try following way to achieve the same result:

-var visitStatsString = JSON.stringify(visitstats);
input(type="hidden", id="visit-stats-json", value= visitStatsString )

Can use inline interpolation:

script.
  var visitstats = #[JSON.stringify(visitstats)];
  ... 

本文标签： javascripthow to use jadepug conditionals inside a script blockStack Overflow