问题描述
我知道,骨干医生说的获取不应该被用来填充在页面加载的集合,我有种找出原因:
i know that backbone doc says fetch should not be used to populate collections on page load,and i kind of figure out why:
var appCollection = Backbone.Collection.extend({
model:appModel,
url:'api/app',
initialize:function(){
this.fetch();
},
});
var homeView = Backbone.View.extend({
el:'#content',
initialize:function(){
this.collection = new appCollection(appModel)
this.render()
},
render: function () {
var that = this;
alert(1);
_.each(this.collection.models, function (item) {
that.renderApp(item);
}, this);
},
renderApp: function (item) {
var appview = new appView({
model: item
});
this.$el.append(appview.render().el);
}
})
var home = new homeView();
在homeview.render功能集合之前实际上被调用牵强,所以当我删除警报(1);我的应用程序不会得到呈现,而我得到一些错误,说:APPNAME(模板)是不确定的。
the homeview.render function actually get called before the collection fetched, so when i remove the alert(1); my app wont get rendered, and i get some error says "appname"(template) is undefined.
任何想法如何做到这一点?
any idea how to do this?
抓取方法来真是得心应手,我不介意等待几秒钟,其实我是打算证明,表明该页面正在初始化,因为我得到了很多其他的事情来下载一个进度条,所以是有可能使用和获取集合时获取实际塔,然后code继续运行???
the fetch method comes really handy and i dont mind to wait for a few second,actually i was intend to show a progress bar indicating that the page is initializing because i got lots of other thing to download,so is it possible to use fetch and when the collection is actually fetched then tha code continue to run???
推荐答案
让我们借此从开始:
var appCollection = Backbone.Collection.extend({
model:appModel,
url:'api/app',
initialize:function(){
this.fetch();
},
});
我会避免在获取初始化
。创建appCollection的实例不应必要取。因此,使用:
I would avoid fetching inside initialize
. Creating an instance of an appCollection should not necessitate fetching. So use:
var appCollection = Backbone.Collection.extend({
model:appModel,
url:'api/app',
});
然后,
var homeView = Backbone.View.extend({
el:'#content',
initialize:function(){
this.collection = new appCollection(appModel)
this.render()
},
render: function () {
var that = this, p;
console.log('fetching...');
p = this.collection.fetch();
p.done(function () {
console.log('fetched!');
_.each(that.collection.models, function (item) {
that.renderApp(item);
}, that);
});
},
renderApp: function (item) {
var appview = new appView({
model: item
});
this.$el.append(appview.render().el);
}
})
var home = new homeView();
这可以让你渲染homeView,当收集被取出,它会显示它的车型。如果您有什么不明白 p.done
呢,来看看的。总之一个Ajax请求返回的承诺。当承诺被满足(即您的收藏被取出)递延火灾和任何功能,您在指定.done()
将被执行。
使用Where I 的console.log
点给的进展反馈。
This allows you to render your homeView and when the collection has been fetched, it will render its models. If you do not understand what p.done
does, have a look at jQuery's Deferred. In brief an ajax request returns a promise. When the promise is fulfilled (i.e. your collection is fetched) the deferred fires and whatever function you specified in .done()
will execute.Use the points where I console.log
to give feedback on the progress.
这篇关于骨干抓取页面加载集合的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!