私はアプリケーションを開発しており、このレールキャストに従っています:
http://railscasts.com/episodes/323-backbone-on-rails-part-1
localhost:3000 で js コンソールを実行するとエラーが発生し続けることを除いて、すべてが正しいようです。次のようになります。
Uncaught TypeError: Cannot call method 'on' of undefined posts_index.js:16
Voice.Views.PostsIndex.PostsIndex.initialize posts_index.js:16
Backbone.View backbone.js:1147
PostsIndex posts_index.js:10
Voice.Routers.Posts.Posts.index posts_router.js:24
(anonymous function) backbone.js:900
(anonymous function) backbone.js:1081
_.some._.any underscore.js:209
_.extend.loadUrl backbone.js:1079
_.extend.start backbone.js:1046
window.Voice.initialize voice.js:10
(anonymous function) voice.js:15
fire jquery.js:975
self.fireWith jquery.js:1083
jQuery.extend.ready jquery.js:407
DOMContentLoaded jquery.js:84
コレクション、モデル、ビュー、ルーター、およびテンプレートのバックボーン コードは次のとおりです。
app/assets/javascripts/voice.js.coffee
Window.Voice =
Models: {}
Collections: {}
Views: {}
Routers: {}
initialize: ->
new Voice.Routers.Posts()
Backbone.history.start()
$(document).ready ->
Voice.initialize()
アプリ/資産/javascripts/application.js
//= require jquery
//= require jquery_ujs
//= require underscore
//= require backbone
//= require voice
//= require_tree ../templates
//= require_tree ./models
//= require_tree ./collections
//= require_tree ./views
//= require_tree ./routers
//= require_tree .
javascripts/routers/posts_router.js.coffee
class Voice.Routers.Posts extends Backbone.Router
routes:
'': 'index'
initialize: ->
@collection = new Voice.Collections.Posts()
@collection.fetch()
index: ->
view = new Voice.Views.PostsIndex()
$('#container').html(view.render().el)
javascripts/views/posts/posts_index.js.coffee
class Voice.Views.PostsIndex extends Backbone.View
template: JST['posts/index']
initialize: ->
@collection.on('reset', @render, this)
render: ->
$(@el).html(@template(posts: @collection))
this
アプリ/アセット/テンプレート/投稿/index.jst.eco
<h1> BACKBONE WORKS</h1>
<tr><td>
<%= @posts %>
</td></tr>
javascripts/collections/posts.js.coffee
class Voice.Collections.Posts extends Backbone.Collection
url: '/api/posts'
model: Voice.Models.Post
javascripts/models/post.js.coffee
class Voice.Models.Post extends Backbone.Model
config/routes.rb
Voice::Application.routes.draw do
match '/login' => 'session#create'
get 'logout', to: 'session#destroy', as: 'logout'
resources :users
scope "api" do
resources :posts
end
root :to => "main#index"
end
controllers/posts_controller.rb
class PostsController < ApplicationController
def index
render :json => Post.all
end
def show
render :json => Post.find(params[:id])
end
def upvote
@post = Post.find(params[:id])
current_user.like(@post)
render :json => @post
end
def downvote
@post = Post.find(params[:id])
current_user.dislike(@post)
render :json => @post
end
def create
@post = Post.create!(:content => params[:content])
render :json => @post
end
end
アプリ/ビュー/メイン/index.html.erb
<table class = 'table table-bordered table-condensed table-hover'>
<div id='container'>
</div>
</table>
バックボーンはデバッグが難しく、すでに 12 時間以上費やしています。誰か助けてくれませんか？