Backbone.js + Her biri için bir tutamaç

Question

Ryan'ın RailsCast on Backbone.js'u Handlebar'larla çalışmaya dönüştürmeye çalışıyorum ve basit bir sorunla karşılaşıyorum.

Bir JSON dizisiyle yineleme yapıp sonucu görüntüleyemiyorum. Ben, benim index.jst.hbs yılında

gem 'backbone-on-rails' 
gem 'handlebars_assets' 

aşağıdakilere sahip

benim Gemfile bu taşlar kullanıyorum:

{{entries.length}} 

<ul> 
    {{#each entries.models}} 
     <li>{{name}}</li> 
    {{/each}} 
</ul> 

API çağrısı sen 7 sayısında görebileceğiniz gibi, çalışıyor gibi görünüyor ekran görüntüsü. Bununla birlikte, her bir modelin içeriği görüntülenmiyor. Bununla birlikte, her modelin içeriği gösterilmiyor. Aşağıda Görünüm (index.js.coffee) ve JSON cevabı aşağıdadır.

class Raffler.Views.EntriesIndex extends Backbone.View 
     template: JST['entries/index'] 

     initialize: -> 
     #triggered when view gets created, listen to 'reset' event, then re-@render, pass 'this' for context binding 
     @collection.on('reset', @render, this) 

     render: -> 
     $(@el).html(@template(entries: @collection)) 
     this 

JSON:

[ 
{ 
"created_at":"2012-06-28T18:54:28Z", 
"id":1, 
"name":"Matz", 
"updated_at":"2012-06-28T18:54:28Z", 
"winner":null 
}, 
{ 
"created_at":"2012-06-28T18:54:28Z", 
"id":2, 
"name":"Yehuda Katz", 
"updated_at":"2012-06-28T18:54:28Z", 
"winner":null 
}, 
{ 
"created_at":"2012-06-28T18:54:28Z", 
"id":3, 
"name":"DHH", 
"updated_at":"2012-06-28T18:54:28Z", 
"winner":null 
}, 
{ 
"created_at":"2012-06-28T18:54:28Z", 
"id":4, 
"name":"Jose Valim", 
"updated_at":"2012-06-28T18:54:28Z", 
"winner":null 
}, 
{ 
"created_at":"2012-06-28T18:54:29Z", 
"id":5, 
"name":"Dr Nic", 
"updated_at":"2012-06-28T18:54:29Z", 
"winner":null 
}, 
{ 
"created_at":"2012-06-28T18:54:29Z", 
"id":6, 
"name":"John Nunemaker", 
"updated_at":"2012-06-28T18:54:29Z", 
"winner":null 
}, 
{ 
"created_at":"2012-06-28T18:54:29Z", 
"id":7, 
"name":"Aaron Patterson", 
"updated_at":"2012-06-28T18:54:29Z", 
"winner":null 
} 
] 

Answer 1

@collection, muhtemelen, bir Backbone.Collection olduğunu telefonunuzda. Gidonlar bunu bir dizi olarak görecek ve {{entries.length}} beklendiği gibi çalışacak ve {{#each entries.models}} doğru sayıda yinelemeli; Ancak, Gidonların 'un içinde yer alan Backbone.Model s ile ne yapacağına dair hiçbir fikri yoktur.

render: -> 
    @$el.html(@template(entries: @collection.toJSON())) 
    @ 

Ve sonra sadece entries bakmak yerine entries.models için şablon ayarlayın::

toJSON kullanılarak @collection ham verileri dönüştürme, Gidon basit JavaScript diziler ve nesneler ile ne yapacağını bilir

<ul> 
    {{#each entries}} 
     <li>{{name}}</li> 
    {{/each}} 
</ul> 

Demo: http://jsfiddle.net/ambiguous/tKna3/

A Omurga ile genel kural, şablonlarınıza model.toJSON() veya collection.toJSON() kodunu aktarmaktır, böylece Omurga yöntemleri (get gibi) hakkında bilgi sahibi olmaları ve böylece şablonlarınızın yanlışlıkla modellerinizi ve koleksiyonlarınızı değiştirmemeleri sağlanır.