1

そこで、jQuery アプリをバックボーンに移動することを考えています。渡された各モデルであるビューのリストを作成するコレクションを渡すビューがあります。このビューは、情報を入力に出力します。ビューから関連付けられたモデルに自動的に伝播できる方法はありますか、それとも自動的に行われますか。

たとえば、次のようなビューがあるとします。

ここに画像の説明を入力

私は以下を持っており、更新すると this.update_value が呼び出されます。しかし、どのモデルが変更されたかをどのように知ることができますか? changeイベントの原因となっている特定のモデルへの参照を取得できますか? これが基本的に聞こえる場合は申し訳ありません。

  var HomepagePositionView = Backbone.View.extend({
    className:'row',
    initialize:function(){
      _.bindAll(this, "render");
      this.listenTo(this.model, 'change', this.update_value);
    },
    render:function(){
         var html="<div class='span2'>" + this.model.get('name') + "</div><div class='span1'><input type=text class='hp_score input-mini pull-right' value='" + this.model.get('hp_score') + "' /></div>";
         $(this.el).html(html);
         this.$('.hp_score').bind('change', this.update_model);
         return this;
    },
    update_model:function(){

      console.log('this model changed' + this.model.id); // this.model.id is not working
    }
  });

と

  var HomepagePositionsView = Backbone.View.extend({
      render:function(){
        // iterate through collection and for each model create a HomepagePositionView
      }

基になるモデルが変更されていない場合は、更新ボタンを空白にしたいと思います。Church と State が 90 から 95 に変更された場合、どのモデルが変更されたかを Backbone で確認する方法はありますか?

どうも

4

2 に答える 2

2

update_model メソッドが間違ったスコープで呼び出されています。そのメソッド内では、「this」は HomepagePositionView を参照する必要がありますが、あなたの場合は、おそらくイベントをトリガーした DOM 要素を参照しています。ビューで「イベント」オブジェクトを定義すると、バックボーン ビューはメソッドを適切なスコープのイベントに自動的にバインドします。詳細については、 http://backbonejs.org/#Viewを参照してください。たとえば、HomepagePositionView で次の行を削除します。

this.$('.hp_score').bind('change', this.update_model);

className 変数の直後に次を追加します。

  events: {
    "change .hp_score": "update_model"
  }

Backbone.View は、「update_model」メソッドを自動的にバインドして、DOM 要素のイベントを hp_score クラスで変更します。「update_model」メソッドは正しいスコープで呼び出されるため、「this」は HomepagePositionView を参照します。

または、今しようとしているように自分でイベントをバインドすることもできますが、render() はビューごとに複数回呼び出される可能性があるため、render() メソッドではなく initialize() メソッドで行います。「update_model」メソッドが正しいスコープで呼び出されるようにするために、アンダースコアの「bind」メソッドを使用して、現在のスコープにバインドされた新しいメソッドを作成できます。このようなもの（ただし、上記のように「イベント」オブジェクトを定義する場合、これは不要です）：

var method = _.bind(this.update_model,this);
this.$('.hp_score').bind('change', method);

2番目の質問については、モデルが変更されたかどうかを確認する方法がある場合、これを行う唯一の方法は、基になるモデルの「変更」イベントを自分でリッスンすることです。

お役に立てれば！

于 2013-09-07T02:56:43.087 に答える
1

最終的には、あなたが言ったように、コレクションを含むビュー (HomepagePositionsView) で変更を処理する必要があります。

ただし、そのビューを 1 つのステップでリッスンする既存のバックボーン イベント(コレクション内のモデルの変更をリッスンするようなもの) があるかどうかはわかりません。・サブパターン。

HomepagePositionView で:

update_value: function() {
    Backbone.trigger('model changed', this.model); //sends off a custom event,  attaching the changed model with it
}

次に、初期化時の HomepagePositionsView で:

initialize: function() {
    Backbone.on('model changed', this.dealwithChange, this); //binds this function to the event
}

...

dealWithChange: function(changedModel) {
    //you can apply your logic to the changed model here.
}

Backbone.off('model changed', this.dealwithChange, this);(また、 HomepagePositionsView を破棄するときにも呼び出すようにしてください)

于 2013-09-07T01:26:47.230 に答える