Question

我正在关注Rails上的Backbone.js这本书，并且正在创建基本的todo应用程序以及读取它但是我在尝试初始化应用程序命名空间内的集合时遇到以下javascript错误：

错误：TodoApp.Collections.Notes不是构造函数源文件：localhost：3000 / assets / todo_app.js？body = 1 行：13

todo_app.js

var TodoApp = {
  Models: {},
  Collections: {},
  Views: {},
  Routers: {},
  initialize: function(data) {
    console.log("INITIALIZE");
    var notes = new TodoApp.Collections.Notes(data.notes); 
    new TodoApp.Routers.Notes({ notes: notes }); 
    Backbone.history.start();    
  }
};

到目前为止我已经按照说明创建了一个Note模型，Notes集合和路由器，这就是在index.html.erb上调用initialize方法的方法：

<%= javascript_tag do %>
  TodoApp.initialize({ notes: <%== @notes.to_json %> });
<% end %>

这是我包含所有文件的顺序：

//= require jquery
//= require jquery_ujs
//= require underscore
//= require json2
//= require backbone
//= require backbone-support
//
//= require todo_app
//
//= require_tree ./models 
//= require_tree ./collections 
//= require_tree ./views 
//= require_tree ./routers 
//= require_tree ../templates
//= require_tree .

任何人都可以帮忙吗？我错过了什么？感谢

Answer 1

TodoApp.initialize({ notes: <%== @notes.to_json %> });似乎是一个错字。它应该是TodoApp.initialize({ notes: <%= @notes.to_json %> });。

Answer 2

Javascript按其加载的顺序进行评估，因此我猜你的应用程序在加载包含该集合的文件之前尝试初始化（你在其他文件之前包含todo_app）。

包括todo_app last或收听文档onload事件并在页面完全加载后初始化应用程序。

Answer 3

尝试使用：

TodoApp.initialize({ notes: <%= @notes.to_json.html_safe -%> });

Answer 4

您可以尝试实例化新集合，然后使用reset方法填充它。

在你的例子中，它应该是这样的：

initialize: function(data){
  var notes = new TodoApp.Collections.Notes()
  notes.reset(data.notes)

}

“reset”方法接受模型列表或散列。有关详细信息，请参阅backbone documentation。

使用此方法的另一个好方法是在网页上预加载信息，然后让我们的集合填充存储的数据。您可以使用如下数据标记在div上插入：

<%= content_tag "div", "Can be blank", id: "container-id", data: { notes: Notes.all } %>

然后致电：

notes.reset($('#container-id').data 'notes')

如果您想了解更多信息，可以查看Ryan Bates Screencasts on Backbone。请注意观看这些视频，您必须订阅他的网站。

PS：如果yout todo_app.js的位置在您的javascript资产文件夹中，则不必使用资产管道添加它，因为//= require_tree .行将由rails自动选取它。 / p>

backbone.js newcomer - 在app namespace initialize方法中创建集合时出错

4 个答案: