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

テンプレートに 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>

templateのアンダースコアのドキュメントを読んでください。また、ここに実際の例http://jsfiddle.net/mFwsK/があります。

于 2013-12-14T20:54:36.063 に答える
0

ビューを管理するためのボイラープレートを大幅に節約するために、バックボーンの上にマリオネットを配置することを強くお勧めします。

于 2013-12-14T20:00:05.237 に答える