$(document).ready に 1 回だけデータをロードするアプリケーションがあります。コレクション ビューとモデル ビューの間にはリンクがあります。ビューには非同期アーキテクチャがあるため、ページの更新時にレンダリングされます。しかし、リンクをクリックしても何もレンダリングされません。データが既にフェッチされており、イベントが発生していないためです。両方の状況を処理できるプラグインまたはトリックはありますか?
Backbone.Collection.prototype.lazyLoad = function (id) {
var model = this.get(id);
if (model === undefined) {
model = new this.model({ id: id });
this.add(model);
model.fetch();
}
return model;
}
var Col = Backbone.Collection.extend({
model: Model,
});
var Model = Backbone.Model.extend({});
var ColView = Backbone.View.extend({
...
initialize: function () {
this.collection.on('reset', this.render);
}
});
var ModelView = Backbone.View.extend({
...
initialize: function () {
this.model.on('change', this.render);
}
});
var AppRouter = Backbone.Router.extend({
routes: {
"": "colView",
"col/:id": "modelView"
},
colView: function () {
new ColView(collection: col);
}
modelView: function (id) {
new modelView(model: col.lazyLoad('modelId'));
}
});
$(document).ready(function () {
col = new Col;
col.fetch();
app = new AppRouter();
});