访问jade模板中的数据(以生成静态html）

Getting access to data in jade template (to make static html)

本文关键字：静态 html 数据 jade 访问      更新时间：2023-09-26

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

玉石问题列表中有很多关于拥有多行代码的请求，所有者评论

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

如果模板中有很多逻辑或对象等，则应该在使用app.helpers（）等时，它们仍然可以是仅查看的助手，但在至少它保持了模板更干净

我不太确定如何在一个咕哝的环境中做到这一点。基本上，如果我能访问我的jade模板中的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}

非常感谢。

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

您可以使用#{your_variable}

在翡翠中渲染数据

希望这能有所帮助：翡翠公众APIhttps://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>。以下是玉石的工作原理：

compile（jadeString）是一个函数，用于确定翡翠需要编译的字符串-jadeString参数，您可以使用fs模块加载翡翠模板的内容并将其放置在这里。fn（jsonData）是将jade模板实际编译为html的函数，jsonData是您想要在模板中使用的数据。

相关文章：