如何在Jade和Express中使用动态布局(Dynamics Layout)？

Question

我正在尝试使用Jade和Express的动态布局。我看到了很多替代方案，但从未见过一种干净的方法来实现它。

我的应用程序将具有许多种模板，包括动态模板。这就像我的应用程序Keystone，所以如果没有它，我就无法继续...

这是一个示例（3种类型的模板）： template_1 template_2 template_3 template_1 包含 template_2 和另一个 template_3 所以，如果它是静态的，我会这样做：

# template.coffee
exports.index = (req, res) ->
  res.render 'template_1'

# template 1
Some HAML content

block content
  div.block
    include template_2
  div.block
    include template_3

但是，我想通过本地变量提供要使用的模板列表：

因此，我考虑做如下操作

# template.coffee
exports.index = (req, res) ->
  res.render 'template_1', {
    template_list: [
      'template_2',
      'template_3'
    ]
  }

# template 1
Some HAML content

block content
  - each current_template in template_list
    div.block
      include current_template

或者

# template 1
Some HAML content

block content
  - each current_template in template
    div.block
      include #{current_template}

但是它不起作用。它将include或extends后面的任何内容都视为字符串...

看起来jade是预先编译的。

那么，是否有可能实现动态包含？或者局部模板？或者动态布局？

感谢您的任何帮助。

- Juaniyyoo

---

目前还不可能。请参考这个线程和这个问题。 - mutil

谢谢 mutil。我选择了 swig。它看起来更适合我的需求。 - Juaniyyoo

Answer 1

考虑在客户端上渲染此内容，使用jadeify: https://github.com/domenic/jadeify，如果您也在使用browserify。

您可以按照以下方式进行操作：

var template = require("./template.jade");

document.getElementById("my-thing").innerHTML = template({
    localVar: "value",
    anotherOne: "another value"
});

- Ashwin Balamohan