node.js - 如何在自定义 Jade 过滤器中渲染 block ？

Question

我有两个 Jade 模板:

# base_template
block do_something
    :custom_filter
        block do_something_main

和

extends base_template

block do_something_main
    h1 Hello There!

我定义了自定义过滤器，如下所示:

var jade = require("jade");
jade.filters.custom_filter = function(html, options) {
    var output = jade.render(html, {filename: options.filename});
    // modify the output
    return "<h1>AWESOME RACCOONS!</h1>" + output;
}

但是，对 jade.render(...) 的调用无法渲染 do_something_main block 。如果我不在自定义过滤器中定义另一个 block ，一切都会正常工作。

例如，使 base_template 不定义 do_something_main block 将正确呈现内容，但这不是我想要的行为或继承模式:

# base_template
block do_something
    :custom_filter
        .awesome_class HELLO THERE

如何让 jade.render(...) 在自定义过滤器内渲染 block ？

Answer 1

我遇到了同样的问题，我认为使用当前版本的 Jade 不可能以干净的方式做到这一点。

在解析器源代码中:https://github.com/visionmedia/jade/blob/master/lib/compiler.js#L488过滤器的内容原封不动地传递给过滤器函数。

但是，可以通过破解 Jade 来实现这一点，但不能保证它可以在未来的版本中运行:

• Jade 向编译后的 mixin 代码公开一些变量，例如 buf , block ，以及您传递给 Jade 的任何其他数据。

• block是一个渲染所包含 block 的函数。遗憾的是，该函数不返回任何值，因为它直接影响缓冲区。

根据这些发现，我能够创建一个巧妙的解决方法:

mixin example()
  - var prevBuf = buf;
  - buf = []
  - block()
  - var blockResult = buf.join('');
  - buf = prevBuf;
  = myFilter(blockResult)

div
  +example()
    | **Hello** world!

为了使其正常工作，您需要传递 myFilter功能到Jade编译。 如果您手动运行 Jade，请将该信息传递给 jade.render :

jade.render(src, {myFilter: function (txt) {...}});

如果您使用 grunt 运行 Jade，请将其传递到 data 选项(请参阅 https://github.com/gruntjs/grunt-contrib-jade#data )。传入filters不起作用，因为在当前的 Jade 版本中，过滤器未公开生成的 mixin 代码。