集合模型和视图代码
Backbone.Collection.extend({
model: xModel,
initialize: function(url) {
this.targetUrl = url;
},
url: function () {
return this.targetUrl;
},
parse: function (data) {
return data.instances;
}
}
Backbone.Model.extend({
defaults: {
location: '',
xyz: ''
},
initialize: function (options) {
},
url: function () {
return this.get('location');
}
}
}
renderInstances: function () {
this.collection = new xyzInstanceCollection(instPath);
this.collection.fetch({
success: _.bind(
function (data) {
for (var i = 0; i < this.collection.length; ++i) {
var model = this.collection.at(i);
model.fetch({
success: _.bind(
function (data) {
/*Call a subView to run the data over a template
and display the instance fetched*/
}, this),
error:
function (e, response) {
/*Do Something else*/
}
});
}
}, this),
error:
function (e, response) {
/*Do Something*/
}
}
});
}
问题 1:现在我期望从成功回调调用的实例的视图将在该模型的获取获取数据后立即开始呈现,但我看到的是 Backbone.js 首先将所有 ajax 调用排队的完整循环,然后一旦所有这些调用都返回了数据,然后视图才开始渲染,无论同步还是异步获取都会发生这种情况,为什么会这样?
问题 2:如果在从此循环中获取所有模型之前按下刷新按钮,浏览器会返回通信错误。当用户想要路由到另一个页面而不关心查看结果时如何中止这些调用,模型获取循环可能返回 1000 个 xhr,我无法将它们全部收集并对其执行中止,有没有更好的方法,请建议。