在Jade和Javascript之间共享布局信息

Question

我有一个基于Node.js / Jade的网站，我试图用一些简单的Javascript添加一些交互性。

特别是，我正在尝试设置一个向表中添加新行的按钮。 表渲染目前在Jade中完成，我打算使用JQuery设置回调来添加行。

我的模板类似于：

tbody#my_body
  - each foo in foos
    tr
      td= foo.blah
      td= foo.hello
      td
        a( ... complex link stuff etc. )

我认为我的JS回调将是

$("a#add_row").click(function(){
  $("#my_body").append( ??? );
});

我可以在append正文中重写HTML中的整个布局内容，但这看起来很愚蠢。每次换一个，我都要改变另一个。

有没有办法在Jade模板和Javascript之间共享布局代码？

Answer 1

我的意思是，在编写视图时，您可以访问服务器端变量。您还可以将模型/变量转储到json并使用它。最后，您可以查看Backbone.js并在客户端/服务器上重用相同的模型。请参阅this post。

Answer 2

所以......我不认为我完全明白你在问什么。您希望表在会话之间是静态还是仅在单个会话或刷新的上下文中？

如果是后者，那么你只需通过jquery添加表行，就像你是一个完整的HTML网站一样。当你调用jquery函数时，express已经将jade模板渲染为完整的html。

如果您希望该行保持不变，那么您需要包含对服务器的调用，该服务器将新行的数据添加到数据集合中以便foo，然后每当页面再次呈现时，服务器将使用所有先前行返回foo +你刚刚添加的那个。