Backbone bu karışıklık

Question

Aşağıdaki kod var:

var GoalPanelView = Backbone.View.extend({ 

    // Bind to the goal panel DOM element 
    el: $("#sidebar-goals"),  

    // Initialize the collection 
    initialize: function() { 
     this.collection = Goals; 
     this.collection.bind('add', this.appendItem); 
    }, 

    // Create a new goal when a user presses enter in the enter goal input 
    createOnEnter: function(e) { 
     if (e.keyCode != 13) return; 
     this.addItem(); 
     //Goals.create(this.newAttributes());   
    }, 

    // Add the goal item to the goal list 
    addItem: function() { 
     var goal = new Goal(); 
     goal.set(this.newAttributes()); 
     var goalsElem = this.el; 
     this.collection.add(goal); 
     $(this.el).children("#enter-goal").val(''); 
    }, 

    // Append DOM element to the parent el 
    appendItem: function(item) { 
     var goalView = new GoalView({ 
      model: item, 
     }); 
     $(this.elem).append(goalView.render().el); 
    } 

}); 

Benim sorunum appendItem fonksiyonunun içindedir. appendItem işlevinin içinde this kullandığımda, this öğesinin GoalPanelView yerine this.collection olduğunu düşündüğüne inanıyorum. this'u yerine GoalPanelView'a başvurmak için nasıl alabilirim? Başka bir değişkeni, this.elem içeriğini tutan appendItem işlevine geçirmeyi denedim, ancak işe yaramadı. Ben collection içine appendItem fonksiyonunu taşındı ve this.collection.bind('add', appendItem); bağlanma başlatma değiştiği çalıştı

bir şey ama collection mantığı içine view şeyler koymak istemiyoruz. aynen böyle bir olay işleyicisi bağlama yaparken

Answer 1

Bir kapsamını ekleyebilirsiniz:

this.collection.bind('add', this.appendItem, this); 

kapsam işleyicisi içinde this değerini ayarlar. Senin durumunda, mevcut nesne.

Düzenleme:Javascript Gardenthis.appendItem aslında işlevin kendisi kapsamını taşımaz neden büyük bir açıklamasını vardır, sadece bir işlev işaretçisi, yöntem değil işaretçi bu. Javascript tuhaflıklar biri ..

Düzenleme Ayrıca initialize yönteminde alt çizgi en _.bindAll fonksiyonunu kullanabilirsiniz 2Backbone Reference - Events/on

Answer 2

:

Şimdi

initialize: function() { 
    _.bindAll(this); 
    this.collection = Goals; 
    this.collection.bind('add', this.appendItem); 
} 

GoalPanelView üzerinde herhangi bir yöntemle herhangi bir çağrı (örneğin appendItem), this başvuruları GoalPanelView örneğine başvurur.

Answer 3

http://underscorejs.org/#bindAll Sadece (Backbone 0,9 itibariyle güncellemek için: Eğer kapsamı GoalPanelView

tüm yöntemleri Buraya bakın istemiyorsanız

Ayrıca dizeleri olarak yöntem isimlerinin liste halinde geçebilir. 2) bunu yapmak için doğru yolu:

initialize: function() { 
    this.collection.on("add", this.appendItem, this); 
    ... 
} 

kullanımı durumda bağlı olarak, may bir Dikkate almak istiyorum:

initialize: function() { 
    this.listenTo(this.collection, "add", this.appendItem); 
    ... 
}