0

如果我在视图中循环集合，它似乎是空的，不会出现警报对话框。当我在这个视图中使用 console.log(this.collection) 时，它看起来没问题（这个集合中有 16 个元素）。

我的路由器：（集合 url：'/api/employees'，这是一个 rails json 输出）

Office.Routers.Employees = Backbone.Router.extend({

  routes: {
    "":   "index"
  },


  initialize: function() {
    this.collection = new Office.Collections.Employees();
    this.collection.fetch();
  },

  index: function() {
    var view = new Office.Views.EmployeesIndex({ collection: this.collection });
    view.render();
  }

});

和我的 index.js 视图：

Office.Views.EmployeesIndex = Backbone.View.extend({

  render: function() {
    this.collection.each( function( obj ){ alert(obj); } );
  }

});

编辑：

这是 console.log(this.collection) 在视图中的输出：http: //i.stack.imgur.com/ZQBUD.png

编辑2：

我认为 Rails 是有罪的。当我使用静态集合时，一切正常

var collection = new Backbone.Collection([
  {name: "Tim", age: 5},
  {name: "Ida", age: 26},
  {name: "Rob", age: 55}
]);
4

2 回答 2

1

collection.fetch()向服务器发出异步请求。索引回调不等待获取返回。所以你的渲染函数正在渲染一个空集合。

您需要使用 fetch 方法的成功回调：

index: function() {
  this.collection.fetch({
    success: function(data) {
      var view = new Office.Views.EmployeesIndex({ collection: data });
      view.render();        
    }        
  });
}

请注意，Backbone 文档建议通过将数据包含在文档本身中来引导您需要的任何初始数据：

当您的应用首次加载时，通常会有一组您知道您将需要的初始模型来呈现页面。与其触发额外的 AJAX 请求来获取它们，更好的模式是让它们的数据已经引导到页面中。

于 2012-07-23T11:56:15.733 回答
0

在您的视图呈现时，获取可能尚未完成。尝试以下操作：

  index: function() {
    var p, collection, view;
    collection = new Office.Collections.Employees();
    p = collection.fetch();
    view = new Office.Views.EmployeesIndex({ collection: collection });
    p.done(view.render);
  }
于 2012-07-23T09:02:13.110 回答