Backbone.js Jade 和循环模型答案

【问题标题】：Backbone.js Jade and looping over modelBackbone.js Jade 和循环模型
【发布时间】：2011-07-30 14:31:56
【问题描述】：

我对使用带有翡翠/下划线的骨干模板感到有些困惑。

我有一个主干模型，其中包含几个数组，但不确定如何呈现数组属性。我可以将它们移动到单独的主干集合和视图中，但在这种情况下，这似乎有点过头了。

我关注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}}')

我想要解决的是如何对模型中的一个数组进行简单循环。例如

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

但我对正确的语法感到很困惑，jade 开始和下划线接管等等。谢谢。

【问题讨论】：

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

【解决方案1】：

您不能在浏览器中使用翡翠（好吧，您可能在技术上可以，但与下划线相反，与骨干一起使用并不常见）。您将在那里使用下划线模板。 The docs on _.template 表明您可以评估 javascript 并使用 _.each 方法循环您的模型的数组属性。

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

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

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

【讨论】：