1

我真的是骨干新手，所以任何关于这方面的帮助都会很棒，即使只是为了向我指出与此相关的一些资源的方向。

我试图创建一个小提琴，但它与我的机器上的工作方式不同：http: //jsfiddle.net/Wh2H5/

基本上我需要做的是将对象数组（见下图）渲染为模板的一部分。

这是我正在渲染的视图：

var ListView = Backbone.View.extend({

    tagName: 'ul',
    className : 'nav nav-list',

    initialize: function() {
        this.collection.bind('all', this.render,this);
        this.template = _.template($('#item-list').html());
    },

    render:function (eventName) {
        $(".bike_list ul").empty();

        this.collection.each(function(bike){
            this.$el.append(this.template(bike.toJSON()));
        },this);

        return this;
    }
});

在此处输入图像描述

因此，要查看问题，请复制此小提琴中的代码并将其粘贴到 html 文档中。

4

2 回答 2

0

我强烈推荐在 Backbone 之上的Marionette，为您节省大量用于管理视图的样板。

于 2013-12-14T20:00:05.237 回答
0

您可以在模板中嵌入 javascript 并循环遍历part_rel数组并相应地呈现对象。代码如下所示：

 <% _.each(part_rel,function(part) {   %>
   <li> 
     Part Name: <%= part.name %>
     After Hp:  <%= part.after_hp %>
   </li>
 <% }); %>

这是添加到您的模板的代码：

<script type="text/template" id="item-list">
  <li class="<%= model %>">
    <strong>Bike ID:</strong>      <%= bikes_id %><br>
    <strong>Model:</strong>        <%= model %><br>
    <strong>Before cc:</strong>    <%= before_cc %><br>
    <strong>Before ci:</strong>    <%= before_ci %><br>
    <strong>Before HP:</strong>    <%= before_hp %><br>
    <strong>Before torque:</strong><%= before_torque %><br>
    <strong>Related parts:</strong><ol>                                
                                     <% _.each(part_rel,function(part) {   %>
                                       <li> 
                                         Part Name: <%= part.name %>
                                         After Hp:  <%= part.after_hp %>
                                       </li>
                                     <% }); %>
                                   </ol>
    <br><br>
  </li>
</script>

阅读下划线的模板文档。此外，这是一个工作示例，http://jsfiddle.net/mFwsK/。

于 2013-12-14T20:54:36.063 回答