0

カレンダーをレンダリングするバックボーン ビューがあり、それが各日のサブビューをレンダリングします。毎日、単一のモデルと、その日を選択または選択解除する単一のクリック イベントがあります。日付を選択するとモデルが保存され、選択を解除するとモデルが破棄されます。

ビューのモデルが破棄されると (日付の選択が解除されたため)、日付が再選択された場合にカレンダーの日付のコレクションに新しいモデルを保存する方法がわかりません。ビューはモデルについてのみ認識し、コレクションについては何も認識しません。モデルが破棄されたときに、新しいモデルの作成と日付ビューへの添付をカレンダー ビューで処理する必要がありますか? または、日付ビューをコレクションに渡して、独自に行う必要がありますか? または、より良い解決策はありますか?

わかりやすくするために、コードの一部を次に示します。


var CalendarView = Backbone.View.extend({
  initialize: function () {
    this.model.dates.on('reset', this.renderDates, this);
  },

  renderDates: function () {
    // Loop through the number of days to display and create a view for each.

      // Find a model for the date. If one doesn't exist, this returns a new model.
      model = this.model.dates.completedOn(date.format('YYYY-MM-DD'));

      view = new DateView({
        model: model
      });

      $dates.append(view.render().el);

    // End loop.
  }
});

var DateView = Backbone.View.extend({
  events: {
    'click .date': 'toggleDate'
  },

  toggleDate: function () {
    if (this.model.selected()) {
      this.model.destroy();
    }
    else {
      this.model.save();
    }
  }
});

助けてくれてありがとう!

4

1 に答える 1

2

次のように設定する必要があるようです。

  1. Backbone.Model選択した日付の A。これを と呼びますM
  2. Backbone.CollectionすべてのMモデルを保持するための A。これを と呼びますC
  3. Backbone.View、 、単一のVM選択された日付を表す場合、modelプロパティは になりますM
  4. Backbone.ViewVC月全体(または年など、表示しているもの)を表す場合、collectionプロパティはC.

次に、そのコレクションのイベントをVCリッスンし、新しく選択された日付が に追加されたときに適切な場所にを挿入できます。'add'VMC

Ma からan を削除するのCもかなり簡単です。モデルのイベントは、そのコレクションでもトリガーされます(コレクションがある場合)。したがって、日付の選択を解除するには、モデルを破棄するだけです。は、そのコレクションのイベントをVCリッスンして、必要に応じてとその全体的な表示をクリーンアップできます。'destroy'VM

この方法では、ほとんどの時間をコレクションとの対話に費やして、選択した日付を管理し、他のすべては適切なイベントに応答することで自動的に整理されます。

これは、ピースがどのように組み合わされるかを示す簡単なデモです: http://jsfiddle.net/ambiguous/TYMTM/

于 2012-10-20T19:11:19.343 に答える