有支持递归的JavaScript模板引擎吗？

Question

我能想到的最明显的例子是输出嵌套评论。假设你有一棵评论树，你想将其作为嵌套的html（比如列表内嵌列表或div内嵌div）使用你的模板输出。

“评论”块/函数/标签/助手或其他东西必须能够以某种方式调用其子评论。

是否有支持在一个模板文件内进行此类操作的模板引擎？

我知道你可以预先计算每个评论的“缩进”或“深度级别”，并将它们作为一个正确排序的平面列表发送到模板，但我不想这样做。而且，我不想在代码/模板之外拼接片段——我希望整个页面都自包含于一个模板或主题文件中。

更新：我想生成嵌套的html。我希望评论是嵌套的，而不是看起来嵌套的。我知道如何用CSS缩进内容。 :) 无论是在浏览器还是服务器上完成操作都不重要，因为关键在于我希望模板是自包含于一个文件中的。

var html = render(template, {comments: aTreeOfNestedComments});

（看到了吗？这可能是node.js，浏览器插件，有些人喜欢称之为"jQuery"的javascript...）看起来jade可以使用mixin实现此功能。有没有类似的基于标记的模板引擎呢？）

- Le Roux Bodenstein

---

为什么选择JavaScript？难道你不能让服务器创建输出吗？ - TJHeuvel

@penartur：“使用Javascript实现的模板引擎”。只需使其成为能够输出HTML的任何模板引擎即可。 - Le Roux Bodenstein

@TJHeuvel：好的，我会在服务器和浏览器中使用它，这样您就可以看到实时预览。我想JavaScript并不太重要。具有不同实现的模板语言 - 其中之一是JavaScript - 也可以使用。 - Le Roux Bodenstein

例如，jade 允许定义辅助方法。 - penartur

“设计师友好”是什么意思？是指脚本化的编辑器（允许您在原始HTML中添加脚本PI）？ - penartur

Answer 1

模板引擎可以解决通用的问题。虽然嵌套模板似乎是一个常见的用例，但我还没有遇到过许多能够实现这一点的模板引擎。

由于市场上没有提供好的解决方案，我正在使用JavaScript对象构建我的应用程序，这些对象知道如何呈现自己。我从不使用模板；每个块都会引用DOM（例如应该附加到其中的父元素）或渲染器返回子容器，父元素可以在适当的位置添加它。

这使我能够充分利用JS的全部功能，而不受模板引擎的限制。

[编辑] 这里有一个解决方法：如果您需要递归元素，请添加一个span（如果递归元素应为内联）或div（如果它是块元素）。给它一个类recursiveTemplate和一个data attribute data-template-name="..."

使用标准模板引擎运行模板。之后，使用jQuery或类似工具查找所有带有类recursiveTemplate的元素，并自行替换它们。

- Aaron Digulla

---

我正在努力制作可设计主题的东西。在这里告诉人们编写 DOM 操作 JavaScript 并不是一个真正的选项。 - Le Roux Bodenstein

在这种情况下，定义自己的HTML元素，允许您说“在此处插入另一个模板”。请参阅我的编辑。 - Aaron Digulla

Answer 2

远端模板在这里有一个嵌套树的示例:

http://code.google.com/p/distal/wiki/UseCaseExamples#Building_a_nested_tree

- Kernel James

Answer 3

正如@TJHeuvel所说，您可以使用服务器端脚本来生成所需的输出，这将是实现您要求的最佳方式。但是，如果您必须使用JavaScript，我建议使用jQuery，这也可以让您产生所需的结果。

例如：

$("ul li").css("margin-left", "10px");

- Bloafer

---

我在我的原始问题中已经解决了这个问题：我特别不想要那个。 - Le Roux Bodenstein

我给你举了一个用法的例子，但是你可以使用递归函数将模板应用于整个树，并使树项完全了解周围的树项，我认为这个答案并不超出原始问题的范围。 - Bloafer

那甚至不是模板代码，那是CSS。我不想在代码中编写或应用递归函数。我非常明确地指出了这一点。我希望递归包含在模板中。 - Le Roux Bodenstein

$("ul li").addClass("myCoolStyle"); - Bloafer