获取jade模板中的数据（制作静态html）

Question

我正在尝试将一些数据传递给玉模板以生成静态内容。我对 node.js 和 express 不太了解，我不使用它们作为后端。我使用jade作为模板引擎并生成静态html。

翡翠问题列表中有很多关于拥有multi line code的请求，并且拥有者cmets

我想提倡在模板、地图等中保留太多的 js 可以通过本地人暴露

如果模板中有很多逻辑或对象等，你应该 正在使用 app.helpers() 等，它们仍然可以是仅查看的助手，但在 至少它使模板更干净

我不太确定如何在 grunt based 环境中执行此操作。基本上，如果我可以访问我的玉模板中的 javascript 变量（可能是文本、js 或 json 文件），那么我可以使用我的模板中的数据并生成静态 html 文件。最好的方法是什么？

---

编辑

为了进一步澄清，我可能有类似的数据（比如在 json 文件中）

user1 = {link: '', lbl: 'User', txt: '.... lot 0f text ....'}
user2 = {link: '', lbl: 'User', txt: '.... lot 0f text ....'}

在我的 mixin 中，不知何故我需要访问我的翡翠模板中的 user1、user2 等

.content
        +colum(user1 )
        +colum(user2 )

mixin colum(d)
    .span4
        h4
            | #{d.lbl}
        p
            | #{d.txt}

非常感谢。

Answer 1

您可以使用以下方式将您的数据呈现在 Jade 中：#{your_variable}

Answer 2

希望对您有所帮助：翡翠公共 API https://github.com/visionmedia/jade#readme

更新：玩了一段时间后，我得到了这个：

var jade = require('jade');

// Compile a function
var fn = jade.compile('p= data');
console.log(fn({'data':'test'}));

当我运行这段代码时，我得到了：<p>test</p>。下面是玉的工作原理：

jade.complie(jadeString) 是一个确定jade 必须编译的字符串的函数-jadeString 参数，您可以使用fs 模块来加载您的jade 模板的内容并将其放置在此处。 fn(jsonData)是真正将jade模板编译成html的函数，jsonData是你要在模板中使用的数据。

Answer 3

如果你想用 grunt-contrib-jade 来做，试试data 选项：

jade: {
  compile: {
    options: {
      data: function(dest, src) {
        // Return an object of data to pass to templates
        return require('./userData.json');
      },
    },
    files: {
      "dest.html": ["templates/*.jade"]
    },
  },
}

这里是上面的文档：https://github.com/gruntjs/grunt-contrib-jade#data