4

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

玉问题列表中有很多关于具有多行代码的要求，并且所有者评论

我想提倡在模板中保留太多的 js，地图等可以通过本地人公开

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

我不太确定如何在基于grunt 的环境中执行此操作。基本上，如果我可以访问我的翡翠模板中的 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}

万分感谢。

4

3 回答 3

5

如果你想用 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

于 2013-07-13T19:41:52.633 回答
1

您可以使用以下命令在翡翠中呈现您的数据：#{your_variable}

于 2013-07-13T18:26:04.850 回答
1

希望这会有所帮助：玉公共 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是要在模板中使用的数据。

于 2013-07-13T18:46:23.627 回答