gpt4 book ai didi

javascript - Jade 编译前如何在 Jade 模板中包含 Javascript 对象

转载 作者:行者123 更新时间:2023-11-29 22:24:30 27 4
gpt4 key购买 nike

我正在使用 Jade/Express 构建的网站工作了几个星期。我最近为网站组织了图像文件夹,因此所有图像都分布在几个文件夹之间,以便于使用和分类。

为了更轻松地更改图像(和其他此类文件)的层次结构,我编写了一个脚本,其中包含一些文件路径的全局变量。现在我一直在尝试让脚本运行,以便我可以调用 jade 模板中的函数来自动使用这些全局变量。

例如。图像现在被分类到几个文件夹中:

文件层次结构

img/
glyphs/
interactivity/
buttons/
...

在我的路径管理器脚本中,我创建了几个函数,包括:

在:path-manager.js

 images_root_path = "/img/";
glyph_path = images_root_path + "glyphs/";
function getGlyph(color, name) {
return glyph_path + color + "/" + name;
}

我尝试了几种方法让脚本在模板之前执行。这是其中一种尝试:

page.jade

include ../../../public/js/lib/path-manager.js
=NamespacePathManager();

理论上,上面应该包含 js,然后我执行下面的命名空间以使函数可用,但那不起作用。

这是 Jade 模板的一部分,我想在其中使用该函数:

page.jade脚本包含之后

span.challenge-time
img(src=getGlyph("black","stopwatch.png"), style="margin-right:5px;")

上面的例子应该返回:"/img/glyphs/black/stopwatch.png"

问题是,我认为,我试图在服务器端提供给 jade 模板的脚本在呈现 jade 模板之前 没有被执行。我为使它正常工作而尝试做的所有事情总是会导致错误,提示服务器无法识别函数 getGlyph 或者当我开始使用命名空间函数时,NamespacePathManager

总结:我希望在将 jade 模板呈现到网页之前执行一个 javascript 文件,这样我就可以在呈现 jade 模板时调用服务器上该 javascript 中的函数和变量。我的问题是我尝试过的所有方法都无法在呈现 Jade 之前执行 javascript。

更新我发现的一种解决方法是将 javascript 直接放入页面上的无缓冲代码中,包括一 block Jade 。这不是我一直在寻找的优雅解决方案,但它现在有效

- some code
- more code

这段代码是内联执行的。缺点是我必须手动将它包含在每个页面上 - 而不是只包含一次并让功能随处可用。

最佳答案

您可以在 Express 中注册helper 方法,然后可以在 View 中访问这些方法。

因此在您的情况下,path-manager.js 可以是您注册的帮助程序文件,并且包含:

var images_root_path = "/img/";
var glyph_path = images_root_path + "glyphs/";

exports.helpers = {
getGlyph: function (color, name) {
return glyph_path + color + "/" + name;
}

// Other helper methods here..
};

然后在设置 express server 的时候,注册 helper

var app = express.createServer();

// app.configure here...
// app.use ...

app.helpers(require('./path-manager.js').helpers);

// Routes set up here ..

最后,您可以像这样从 Jade View 调用辅助方法:

span.challenge-time
img(src='#{getGlyph("black","stopwatch.png")}', style='margin-right:5px;')

在 DailyJS http://dailyjs.com/2011/01/03/node-tutorial-8/ 上有一篇关于这个主题的好文章

关于javascript - Jade 编译前如何在 Jade 模板中包含 Javascript 对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10420990/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com