Backbone.js Jade和循环模型

时间:2011-07-30 14:31:57

标签: javascript node.js backbone.js pug underscore.js

我对使用jade /下划线的骨干进行模板操作感到有些困惑。

我有一个骨干模型,里面有几个数组,我不知道如何渲染数组属性。我可以将它们移动到一个单独的主干集合中。在这种情况下看起来有点矫枉过正。

我跟着this blog post on using backbone with jade并将以下内容添加到我的主干文件

   _.templateSettings = {
      interpolate : /\{\{(.+?)\}\}/g
   };

允许我在这个庄园中渲染模型属性:

      //in my JavaScript
      this.template = _.template($("#some-template").html());

      //in my .jade template
      input.text(type='text', name="name", value='{{name}}')

我想要解决的是如何在模型中的一个数组上进行简单的循环。 e.g。

    - for (var child in children)
        {{child}}

但我对正确的语法非常困惑,其中jade开始并且下划线接管等等。谢谢。

1 个答案:

答案 0 :(得分:5)

你不能在浏览器中使用jade(嗯,你可能在技术上可以,但使用骨干而不是下划线并不常见)。你将在那里使用下划线模板。 The docs on _.template表明您可以评估javascript并使用_.each方法遍历模型的数组属性。

在视图的render功能中,它最终会看起来像这样。您需要将模板函数缓存为视图的属性以提高效率,但为简单起见,我将其内联到此处。例如,假设您有一个Car模型,其中drivers列表是一个驱动程序名称数组。

var template = "<% _.each(model.drivers, function(name) { %> <li><%= name %></li> <% }); %>";
return _.template(template, this);

请注意,您需要在模板设置中提供evaluate语法,因为此示例包含模板标记的插值样式(<%=)和评估样式(<%) 。目前你只有胡子样式插值,这是不够的。