backbone.js атрибут модели undefined

Question

Я собираю коллекцию объектов модели из остального url в позвоночнике. Затем я перебираю коллекцию и использую вспомогательный метод шаблона подчеркивания с данными из модели. Но я получаю undefined defaultImg при вызове атрибута.

Вид:

define (['jquery','underscore','backbone'],function($,_,Backbone){ 
PopVideoView = Backbone.View.extend ({ 
    tagName:"li", 
    //template: _.template($('#popView').html()), 
    template: _.template("<li><img src='<%= defaultImg %>'/></li>"), 
    render: function() 
    { 
     console.log(this.model.toJSON()); 
     this.template(this.model.toJSON()); 
     this.$el.html(this.template); 
     return this; 
    } 
}); 
return PopVideoView; 
}); 

другой вид:

define(['jquery','underscore','backbone','collections/PopVideos','views/PopVideo'],function($,_,Backbone){ 
PopVideosView = Backbone.View.extend ({ 
    el:"#pop", 
    render: function() 
    { 
     this.collection.each (function(video) 
     { 
      popVideoView = new PopVideoView({model:video}); 
      this.$el.append (popVideoView.render().el).hide().fadeIn(300); 
     },this); 
     return this; 
    }, 
}); 
return PopVideosView; 
}); 

Это то, что я получаю от Chrome консоли разработчика:

Object {video_id: "1G4isv_Fylg", video_name: "Coldplay - Paradise ", defaultImg: "http://i.ytimg.com/vi/1G4isv_Fylg/mqdefault.jpg", genre: "pop", date: "Feb 16, 2013 1:01:33 PM"…} 
Uncaught ReferenceError: defaultImg is not defined 

, что я делаю не так?

Это модель & коллекция:

define (['jquery','underscore','backbone'],function($,_,Backbone){ 
Video = Backbone.Model.extend ({ 
    urlRoot:"/video", 
}); 
return Video; 
});//end define 

define(['backbone','models/Video'],function(Backbone,Video) { 
PopVideosCollection = Backbone.Collection.extend ({ 
    model:Video, 
    url:"/pop/3/1" 
}); 
return PopVideosCollection; 
}); 

Answer 1

Я нашел эту проблему мне просто нужно сделать это:

this.$el.html(this.template(this.model.toJSON())); 

вместо:

this.template(this.model.toJSON()); 
this.$el.html(this.template); 

Answer 2

render метод у вашего PopVideoView возникли проблемы:

template: _.template("<li><img src='<%= defaultImg %>'/></li>"), 
render: function() 
{ 
    console.log(this.model.toJSON()); 
    this.template(this.model.toJSON()); 
    this.$el.html(this.template); 
    return this; 
} 

Когда вы звоните _.template, вы получаете функцию назад, так это:

this.template(this.model.toJSON()); 

имеет смысл кроме того, что вы выбрасывая HTML возвращаемого значения. Эта часть:

this.$el.html(this.template); 

где вы ошибетесь, вы передаете функцию html метода JQuery и от fine manual:

.html (функция (индекс, oldhtml))

Функция (индекс, oldhtml)

Функция, возвращающая содержимое HTML для установки.

Так что jQuery вызывает вашу функцию this.template с аргументами, которые он не понимает. Тогда скомпилированная функция шаблона идет искать defaultImg где-то, не находит его, и вы получаете ReferenceError, потому что нет defaultImg.

Вы не хотите, чтобы передать функцию html(), вы хотите оценить функции шаблона и передать ее возвращаемое значение html():

render: function() 
{ 
    this.$el.html(this.template(this.model.toJSON())); 
    return this; 
} 

И КСТАТИ, вы действительно должны использовать var когда определяя свои взгляды и модели:

define (['jquery','underscore','backbone'],function($,_,Backbone){ 
    var PopVideoView = Backbone.View.extend ({ 
    ^^^ 

Эти переменные являются глобальными, если вы не var им.