これは明らかなはずですが、非常に多くの異なる例が存在するようで、そのほとんどがエラーを引き起こし、時代遅れだと思います。基本的な状況は、ItemView を拡張する MessageView にリンクされた MessageModel、MessageCollectionView (itemView: MessageView) にリンクされた MessageCollection があることです。MessageCollection が非同期に設定されるという、少し変わったシナリオがあるため、ページが最初にレンダリングされるとき、ページは空で、「読み込み中」アイコンが表示されます。たぶん、構造が間違っているかもしれません（ここを参照してください履歴用) ですが、現時点では、サーバーに対して最初の要求を行い、MessageCollection オブジェクト内のメッセージの最初のリストを受信して、それ自体が更新されるようにするコードをカプセル化しました。ただし、これを考えると、ビューの表示をトリガーする方法は明確ではありません。明らかに、モデルはビューにレンダリングするように指示するべきではありませんが、ビューをインスタンス化し、モデル変更イベントをリッスンして「レンダリング」を呼び出す試みはどれもうまくいきませんでした。
私が試してみました：
- 読み込み要素はありません。読み込み時に要素のない CollectionView を表示するだけですが、基になるコレクションが更新された後は更新されません。
- modelEvents { 'change': 'render' } をビューに追加 --> Uncaught TypeError: Object function () { return parent.apply(this, arguments); メソッド「on」がありません
- this.bindTo(this.collection..) も試しましたが、「this」には bindTo メソッドがありませんでした
- 最後に、view.initialize: _.bindAll(this); で試しました。this.model.on('change': this.render); --> キャッチされていない TypeError: オブジェクト関数 () { [ネイティブ コード] } にはメソッド 'on' がありません
ここにコードがあります
Entities.MessageCollection = Backbone.Collection.extend({
defaults: {
questionId: null
},
model: Entities.Message,
initialize: function (models, options) {
options || (options = {});
if (options.title) {
this.title = options.title;
}
if (options.id) {
this.questionId = options.id;
}
},
subscribe: function () {
var self = this; //needed for proper scope
QaApp.Lightstreamer.Do('subscribeUpdate', {
adapterName: 'QaAdapter',
parameterValue: this.questionId,
otherStuff: 'otherstuff',
onUpdate: function (data, options) {
console.log("calling sync");
var obj = JSON.parse(data.jsonString);
self.set(obj.Messages, options);
self.trigger('sync', self, obj.Messages, options);
}
});
},
});
Views.MessageCollectionView = Backbone.Marionette.CollectionView.extend({
itemView: Views.MessageView,
tagName: 'ul',
// modelEvents: {
// 'change': 'render'
// },
onAfterItemAdded: function (itemView) {
this.$el.append(itemView.el);
}
});
var Api = {
subscribe: function (id) {
var question = new QaApp.Entities.Question(null, { id: id });
question.subscribe();
var questionView = new QaApp.Views.QuestionView(question);
QaApp.page.show(questionView);
}
};
すでに受けたすべての支援に非常に感謝しており、ご覧いただきありがとうございます。