Backbone.js - 无法获取数据，或绑定到集合上的 fetch 事件？答案

【问题标题】：Backbone.js - can't fetch data, or bind to the fetch event on collection?Backbone.js - 无法获取数据，或绑定到集合上的 fetch 事件？
【发布时间】：2012-02-28 22:28:51
【问题描述】：

我正在使用 jQuery 1.7.1、Underscore 1.3.1 和 Backbone 0.9.1。这是我的 Backbone 代码，完整：

$(function(){
  window.Student = Backbone.Model.extend({
  });
  window.Students = Backbone.Collection.extend({
    model: Student, 
  });
  window.AllStudents = new Students();
  AllStudents.url = "/init.json";
  AllStudents.bind('reset', function() { 
      console.log('hello world');  
  }); 
  AllStudents.fetch();
  AllStudents.fetch({ url: "/init.json", success: function() {
      console.log(AllStudents);
  }, failure: function() { 
      console.log('failure');
  }});
  AllStudents.fetch({ url: "/init.json" }).complete(function() {
      console.log(AllStudents);
  });
});

在第三个.fetch() 调用中甚至只出现了一个控制台语句，然后它是一个空对象。

我很困惑。我究竟做错了什么？如何绑定到重置事件并使用获取的数据？

这是 JSON 文件：

[
  { text: "Amy", freq_2011: 5 },
  { text: "Angeline", freq_2011: 26 },
  { text: "Anna", freq_2011: 55 }    
]

我检查了 JSON 文件是否作为 application/json 提供，并且我还可以看到它被 XHR 请求获取了 3 次。

更新：这是我的完整 HTML：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test</title>
</head>
<body>
<div class="container"></div>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.1/underscore-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.1/backbone-min.js"></script>
<script src="/js/test.js"></script>
</body>
</html>

其他人可以重现该问题吗？

【问题讨论】：

您是否尝试在集合本身的定义中设置 url 参数？
是的，没有帮助:(请其他人尝试代码，看看他们是否可以重现问题？
我最终通过使用自举模型解决了这个问题：documentcloud.github.com/backbone/#FAQ-bootstrap 不过，我仍然完全不知道出了什么问题。

标签： javascript backbone.js

【解决方案1】：

Backbone 有一个很好的函数，它可以被称为parse，一旦成功调用，它就会获取获取的数据作为其参数。例如，一旦加载 JSON，您就可以使用它来处理它：

window.Students = Backbone.Collection.extend({
    model: Student,
    parse: function(response) {
       console.log(response,response.results);
       return response.results;
  }
});

【讨论】：