pugjs / pug

Pug – robust, elegant, feature rich template engine for Node.js
https://pugjs.org
21.66k stars 1.95k forks source link

Arrays of strings should be rendered more simply #2975

Open johnkazer opened 6 years ago

johnkazer commented 6 years ago

Pug Version: 2.0.0-rc.4

Node Version: v9.2.0

Input JavaScript Values

const benchmarkData = {
        "labels": [
            "'Heating gas'"
        ],
        "series": [
                        180, 70, 50, 40, 23
                    ]
        };
res.render('benchmarktool', {
        benchmark: benchmarkData
    });

Input Pug

script
    | const energyLabels = [#{benchmark.labels}];
    | const pieSeries = [#{benchmark.series}];

Expected HTML

Actual HTML

Additional Comments

I need to enclose strings in an array with "'xxx'" two inverted commas/apostrophes, in order to get energyLabels = ['Heating Gas'] in my html. This is very unclear from documentation and was not the behaviour I expected - why the need for "' '"?

ForbesLindesay commented 6 years ago

We're just outputting the raw data as a string. You should use js-stringify:

const benchmarkData = {
        "labels": [
            "Heating gas"
        ],
        "series": [
                        180, 70, 50, 40, 23
                    ]
        };
res.render('benchmarktool', {
        stringify: require('js-stringify'),
        benchmark: benchmarkData
    });
script
    | const energyLabels = !{stringify(benchmark.labels)};
    | const pieSeries = !{stringify(benchmark.series)};

We are considering adding something to make this clearer/easier.