一尘不染

Backbone.js-即使获取成功,也不会在集合中填充数据

json

我正在尝试从一个简单的JSON文件填充一个集合,这是学习骨干.js的一部分。但是我无法使它工作。

进行了AJAX调用(已通过FireBug验证),但是该toJSON方法返回 undefined

我究竟做错了什么?

theModel =  Backbone.Model.extend();

theCollection = Backbone.Collection.extend({
    model: aModel,
    url: "source.json"
});

theView = Backbone.View.extend({
   el: $("#temp"),
   initialize: function () {
       this.collection = new theCollection();
       this.collection.fetch();
       this.render();
   },
   render : function () {
       $(this.el).html( this.collection.toJSON() ); // Returns blank
   }
});

var myView = new theView;

这是我的JSON:

[{
    "description": "Lorem ipsum..."
 },
 {
    "description": "Lorem ipsum..."
}]

阅读 219

收藏
2020-07-27

共1个答案

一尘不染

fetch是异步的,如果立即调用,则不会填充您的集合render。要解决此问题,您只需将集合 重置 事件(Backbone的 同步 事件>
= 1.0)绑定到视图render:

theView = Backbone.View.extend({
   el: $("#temp"),

   initialize: function () {
       this.collection = new theCollection();

       // for Backbone < 1.0
       this.collection.on("reset", this.render, this);

       // for Backbone >= 1.0
       this.collection.on("sync", this.render, this);

       this.collection.fetch();
   },

   render : function () {
    console.log( this.collection.toJSON() );
   }
});

请注意bind方法的第三个参数,为该方法提供正确的上下文:http : //documentcloud.github.com/backbone/#FAQ-
this

2020-07-27