dinamik olarak atamak için uygun yol backbone.js görünüm el

Question

Her biri farklı el nitelikleri olan iki (veya daha fazla) görünüm örneği oluşturmak istiyorum ve backbone.js görünümünün etkinlik karması (jQuery aracılığıyla değil) aracılığıyla bunlara bağlı etkinliklere sahip olmak istiyorum . Tüm örneklemi aynı el varken tetiklemek için olayları alınıyor

kolaydır:

someView = Backbone.View.extend({ 
    el: '#someDiv', 

    events: { 
    'click': 'someFunction' 
    }, 

    someFunction: function(){ 
    //Do something here 
    } 
}); 

Şimdiye kadar, ben initialize fonksiyonunda el atayabilir ve normalde events set aşağıdaki gibi, olaylar tetiklemek yoksa:

:

someView = Backbone.View.extend({ 
    events: { 
    'click': 'someFunction' 
    }, 

    initialize: function(options){ 
    this.el = options.el 
    }, 

    someFunction: function(){ 
    //Do something here 
    } 
}); 

Benim ilk içgüdüsü olmak ilgilenilen dom elemanının dize temsilini döndüren bir işlev el sahip olmaktı Ben x instantiations varsa

someView = Backbone.View.extend({ 
    el: function(){ 
    return '#someDiv-' + this.someNumber 
    }, 

    events: { 
    'click': 'someFunction' 
    }, 

    initialize: function(options){ 
    this.someNumber = options.someNumber 
    }, 

    someFunction: function(){ 
    //Do something here 
    } 
}); 

Ancak bu someFunction x kez tetikler.

Sonraki Ben initialize içinde el ve events özelliklerini hem ayarlama çalıştı:

someView = Backbone.View.extend({ 

    initialize: function(options){ 
    this.el = options.el 
    this.events = { 
     'click': 'someFunction' 
    } 
    }, 

    someFunction: function(){ 
    //Do something here 
    } 
}); 

ama bu olayları tetiklemez. Bu noktada oldukça fazla balık tutuyorum.

Herhangi bir backbone.js görüntüsünü, bu örnek için yalnızca View'un diğer örneklerini değil, yalnızca bu örnek için tetikleyen olayları içeren bir el ile nasıl eşleştirdiğini biliyor mu?

Answer 1

Aslında "this.element" öğelerinin tümünü izlemeniz gerekmez.

Backbone, otomatik olarak görünümü "el" in yapıcısına geçirdiğiniz "el" seçeneğine bir seçenek olarak ayarlar.

Bu görünüm boyunca "this.el" olarak kullanılabilir.

Bu

yapmanız gereken tek şey:

x = Backbone.View.extend({ 
    events: { 
     'click': 'say_hi' 
    }, 

    initialize: function(options){ 
     // Not actually needed unless you're doing something else in here 
    }, 

    say_hi: function(){ 
     alert(this.el.id); 
    } 

    }); 

y = new x({el: '#div-1'}); 
z = new x({el: '#div-2'}); 

z.say_hi(); 
y.say_hi(); 
​ 

bu canlı jsFiddle bakınız: http://jsfiddle.net/edwardmsmith/QDFwf/15/

sizin ikinci örnek işe yaramadı nedeni Omurga son sürümleri ile, sadece ayarlanmamış olmasıdır "el" artık daha fazla. Bu, fark ettiğiniz gibi olayları düzgün şekilde ayarlamaz/günceller. dinamik bu şekilde el ayarlamak isteseydik

initialize: function(options){ 
    this.el = options.el; 
} 

Çalışmaz, bunu düzgün delegeler olaylar olarak View.setElement kullanmak gerekir ve önbelleğe this.$el kurar.

İşleri ikinci örnek

initialize: function(options){ 
    this.setElement(options.el) 
} 

Canlı jsFiddle: http://jsfiddle.net/edwardmsmith/5Ss5G/21/

Ama bu sadece yeniden yapıyor zaten omurga içerisine kaputun altında yapılıyor ne.