2013-07-08 54 views
6

可以说我打开了一个浏览器,并在JavaScript中声明了一个全局变量。Jade模板如何使用客户端全局变量?

window.myGlobalVar = 'Hello!'; 

然后,我编译一个用于客户端渲染的玉石模板,使用该变量。

.foo= myGobalVar 

这我编译如下所示:

jade.compile('.foo= myGobalVar', { 
    client: true, 
    compileDebug: false 
}).toString() 

其中产量这个模板功能:

function anonymous(locals) { 
    var buf = []; 
    var locals_ = (locals || {}), 
     myGobalVar = locals_.myGobalVar; 
    jade.indent = []; 
    buf.push("\n<div class=\"foo\">" 
      + (jade.escape(null == (jade.interp = myGobalVar) ? "" : jade.interp)) 
      + "</div>");; 
    return buf.join(""); 
} 

跑的时候,会产生:

<div class="foo">undefined</div> 

正如你所看到的,玉器编译器注意到我使用了一个变量,并通过myGobalVar = locals_.myGobalVar;强制它成为局部变量,这影响了我实际想要使用的全局变量。

所以我尝试引用window.myGlobalVar和玉然后只是影子window

为什么不仅仅传递给我想要使用的每个全球?那么在运行时我不知道什么样的全局变量是必要的。我有几十个全局构造函数,并且明确地传递它们将需要相当的重构。

那么如何获得一个客户端玉模板编译的方式,允许引用glbal变量?


更新:

我也有点这种成功。

for (key in window) { 
    if (localsObject[key] == null) 
    localsObject[key] = window[key]; 
    } 
} 

renderTemplate(localsObject); 

但该死的让我觉得脏......当然有更好的办法吗?

+1

(只将注意力集中在'myGobalVar' VS'myGlobalVar') – Kos

回答

2

您可以将选项对象传递给编译函数,并将您想要在jade模板中使用的全局变量的名称传递给编译函数。见玉API文档:http://jade-lang.com/api/

jade.compile(template, { globals: ['globalone','globaltwo']}) 

看到这个小提琴看到它在行动:http://jsfiddle.net/lchngr/J5WJb/5/

+0

你的小提琴没有玉文件 – danielrvt

+0

有是没有玉档的!玉代码是字符串。请再次看看小提琴并重新考虑你的投票。但是导入的momentjs lib的链接被破坏了。我更新了提琴手链接 – slu