我的问题:“未捕获的TypeError:无法调用未定义的'get'方法” - 这意味着尽管调用了$(@ el).html(@template(我),但我还是没有设法将我的模型从视图传递到模板小马:@model))当我渲染。
上下文:这是我的第一个骨干应用程序。我正在使用backbone-on-rails gem并继续使用Ryan Bates的railscast:http://railscasts.com/episodes/325-backbone-on-rails-part-2。 backbone-on-rails gem在assets / javascripts文件夹中生成空路由器,集合,模型,视图和模板文件。我确定它会在seens背后做一些其他事情,但我不确定是什么。所有的扩展都是js.coffee所以空白很重要!
怀疑:由于TypeError发生在正确的模板中,我假设我的路由器和事件绑定都很好。由于我视图中的对象未定义,因此我假设我对集合和模型的所有引用都是可疑的。因此,我将从相关模板开始发布代码,然后是我的模型视图,然后是我的集合视图,然后是我的模型类,然后是我的集合类。
我的模板模板:app / assets / javascripts / templates / ponies / pony.jst.eco
<%= @pony.get('name') %>
<img src="<%= pony.get('img_url') %>" alt="shutterfly" height="70" width="70">
<% if @pony.get('selected'): %>
<span class="selected">SELECTED</span>
<% end %>
我的模型视图:app / assets / javascripts / views / ponies / pony.js.coffee
class Mlp.Views.Pony extends Backbone.View
template: JST['ponies/pony']
tagName: 'li'
events:
'click': 'showPony'
initialize: ->
@model.on('change', @render, this)
@model.on('select', @selectPony, this)
showPony: ->
Backbone.history.navigate("ponies/#{@model.get('id')}", true)
selectPony: ->
$('.selected').removeClass('saddled')
@$('.selected').addClass('saddled')
render: ->
$(@el).html(@template(pony: @model))
this
我的收藏视图:app / assets / javascripts / views / ponies / ponies_index.js.coffee
class Mlp.Views.PoniesIndex extends Backbone.View
template: JST['ponies/index']
events:
'submit #new_pony': 'createPony'
'submit #new_setting': 'changeSetting'
'click #pony_up': 'ponyUp'
initialize: ->
@collection.on('reset', @render, this)
@collection.on('add', @appendPony, this)
@collection.on('change', @render, this)
render: ->
$(@el).html(@template())
@collection.each(@appendPony)
this
appendPony: (pony) =>
view = new Mlp.Views.Pony(model: pony)
@$('#ponies').append(view.render().el)
ponyUp: (event) ->
event.preventDefault()
@collection.ponyUp
changeSetting: (event) ->
event.preventDefault()
setting = document.getElementById "setting"
new_src = $('#new_setting_img_url').val()
console.log setting
console.log new_src
setting.src = new_src
createPony: (event) ->
event.preventDefault()
attributes = name: $('#new_pony_name').val()
img_url: $('#new_pony_img_url'.val())
@collection.create attributes,
wait: true
success: -> $('#new_pony')[0].reset()
error: @handleError
handleError: (pony, response) ->
if response.status == 422
errors = $.parseJSON(response.responseText).errors
for attribute, messages of errors
alert "#{attribute} #{message}" for message in messages
我的模型类:app / assets / javascripts / models / pony.js.coffee
class Mlp.Models.Pony extends Backbone.Model
select: ->
@set(selected: true)
@save()
@trigger('saddle')
我的收藏类:app / assets / javascripts / collections / ponies.js.coffee
class Mlp.Collections.Ponies extends Backbone.Collection
url: '/api/ponies'
model: Mlp.Models.Pony
ponyUp: ->
selected = @shuffle()[0]
selected.select() if selected
我确实有一个种子文件,我用名字和img_urls创建了Ponies。
提前感谢您的帮助!
从我获得的模型模板中删除变量: 未捕获的TypeError:对象#的属性“模板”不是函数
我从模型视图生成的html是:
Pony.prototype.render = function() {
$(this.el).html(this.template({
pony: this.model
}));
return this;
我不知道为什么我不能在模型上调用模板,因为我在模型视图的顶部定义了它。