【问题标题】:Are there javascript template engines that support something like recursion?是否有支持递归之类的javascript模板引擎?
【发布时间】:2012-05-14 08:08:47
【问题描述】:

我能想到的最明显的例子是输出嵌套的 cmets。假设您有一棵 cmets 树,并且您想使用您的模板将其输出为嵌套的 html(比如说列表中的列表或 div 中的 div)。

“评论”块/函数/标签/助手/任何东西必须能够以某种方式为评论的孩子调用自己。

是否有模板引擎可以在一个模板文件中支持这种事情?

我知道您可以预先计算每条评论的“缩进”或“深度级别”,并将它们作为一个平面列表以正确的顺序发送到模板,但我们只是说我不想要那。假设我不想在代码中/模板之外将 sn-ps 拼接在一起 - 我希望整个页面都包含在一个模板或主题文件中。


更新:我想生成嵌套的 html。我希望 cmets 嵌套,而不是 appear 嵌套。我知道如何使用 CSS 缩进。 :) 无论是在浏览器还是在服务器上完成都无关紧要,因为我希望模板在一个文件中自包含。

如:

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

(看到了吗?这可能是 node.js,一个浏览器插件,一些“jQuery”,因为有些人现在喜欢称之为 javascript...)看起来玉可以使用 mixins 来做到这一点。有没有可以做类似事情的基于标签的模板引擎?

【问题讨论】:

  • 为什么是Javascript?不能让服务器创建输出吗?
  • “Javascript 模板引擎”是什么意思?
  • @penartur:“用 javascript 实现的模板引擎”。只需将其设为任何能够输出 html 的模板引擎即可。
  • @TJHeuvel:嗯,会在服务器上的 node.js 和浏览器中使用它,这样你就可以看到实时预览。我猜javascript没有太大关系。具有不同实现的模板语言(其中之一是 javascript)也可以工作。
  • 例如,jade 允许定义辅助方法。

标签: javascript templates recursion


【解决方案1】:

模板引擎可以解决一般的、常见的问题。虽然嵌套模板似乎是一个常见的用例,但我还没有遇到很多可以做到这一点的模板引擎。

由于市场没有提供好的解决方案,我正在从知道如何呈现自己的 JavaScript 对象构建我的应用程序。我从不使用模板;每个块都获得对 DOM 的引用(就像应该附加自身的父元素一样),或者渲染器返回子容器,父元素可以将其添加到合适的位置。

这让我可以使用 JS 的全部功能而不受模板引擎的限制。

[编辑] 这里有一个解决方法:如果你需要一个递归元素,添加一个span(如果递归元素应该是内联的)或div(如果它是一个块元素) .给它上课 recursiveTemplatedata attribute data-template-name="..."

使用标准模板引擎运行模板。之后,使用 jQuery 之类的方法查找所有类为 recursiveTemplate 的元素并自行替换。

【讨论】:

  • 我正在尝试做一些设计师主题的东西。告诉人们编写 DOM 操作 JavaScript 并不是一个真正的选择。
  • 在这种情况下,定义您自己的 HTML 元素,允许您说“在此处插入另一个模板”。查看我的编辑。
【解决方案2】:
【解决方案3】:

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

例如:

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

【讨论】:

  • 我已经在我原来的问题中解决了这个问题:我特别不想要那个。
  • 我给你一个使用示例,但是你可以使用递归函数将模板应用到整个树,并使树项完全了解周围的树项,我不觉得答案超出了原始问题的范围。
  • 那甚至不是模板代码,那是 CSS。而且我不想在代码中编写或应用递归函数。我对此非常具体。我希望递归包含在模板中。
  • 类似$("ul li").addClass("myCoolStyle");
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-07-11
  • 1970-01-01
相关资源
最近更新 更多