簡體   English   中英

鏈接的JavaScript文件的帕格字符串插值

[英]Pug string interpolation for linked JavaScript files

我要做什么

我有一個NodeJS網絡服務器,該服務器使用ExpressPug提供HTML和JavaScript文件。 看起來像這樣:

index.pug

html
    head
        title Hello
    body
        h1 Hello World!
        script(src='script.js')

app.js

const express = require('express');
var app = express();
app.set('view engine', 'pug');

app.get("/", (req, res) => {
    res.render("index", {
        age: 91,
        name: 'George P. Burdell'
    });
});
app.listen(8080);

script.js

var person = {
    age: #{age},
    name: #{name}
};

(源自並添加到GitHub示例中

我希望能夠將#{age}#{name}占位符交換為res.render()函數中指定的值(即{age: 91, name: 'George P. Burdell'} )。

問題

截至目前,這些值尚未交換,控制台吐出一個錯誤,指示無法識別帶有占位符#{age}#{name}的行。 僅當將script.js中的JavaScript代碼作為內部腳本帶入.pug文件時,才交換占位符值,如下所示:

index.pug

html
    head
        title Hello
    body
        h1 Hello World!
        script.
            var person = {
                age: #{age},
                name: #{name}
            };

但是我想要做的是直接從外部腳本文件交換值,例如在初始設置中。 除了將代碼“實時”保存在.pug文件中之外,我還沒有找到一種簡單的方法來運氣。

所以我有一個解決方法。 您可以在.pug文件的內部腳本標記中設置全局變量,然后可以使用pug對其進行插值。 作為視覺效果,這就是我的意思:

index.pug

html
    head
        title Hello
    body
        h1 Hello World!
        script.
            var age = #{age};
            var name = #{name};
        script(src='script.js')

script.js

var person = {
    age: age, // the age variable from the internal script is used
    name: name // the name variable from the internal script is used
};

app.js保持不變!

編輯

app.js

res.render("index", {
    age: 91,
    name: 'George P. Burdell'
});

應該

res.render("index", {
    age: "91",
    name: "'George P. Burdell'"
});

交換后保持數據類型!

如果有更好的解決方法,請告訴我! 目前,這是公認的答案。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM