Backies.js

Question

ile Rivets.js içinde özel bir bağlayıcı kullanırken düğmelere "radyo" işlevselliği eklenmesi Elemanlarıma modele bağlanmak için Rivets.js kullanıyorum. Tasarım için Twitter tarafından Bootstrap kullanıyorum ve 1, 2 ve 3 değerlerinden (radyo düğmelerine işlevsel olarak eşdeğer) seçim yapmak için üç düğme ayarladık.

Böyle bir düğme grubunda üç düğme kurdunuz:

<div class="btn-group" id="input_level" data-toggle="model.level"> 
    <button data-toggle-value="1" class="btn active">One</button> 
    <button data-toggle-value="2" class="btn">Two</button> 
    <button data-toggle-value="3" class="btn">Three</button> 
</div> 

Ben toggle bağlayıcı şöyle özel bir eklemiş: olması gerektiği gibi

rivets.binders.toggle = function(el,value){ 
    $(el).find('button[data-toggle-value="' + value + '"]') 
     .addClass('active').siblings().removeClass('active'); 
} 

Bu düğme durumunu günceller, ama diğer şekilde çalışmıyor - yani düğme tıklama olayına bağlı bir olay yok. Bunu, Rivets.js'ye genellemek istiyorum. Bu yüzden, omurga görünümünde her düğme grubuna bir tıklama olayı eklemem gerekmiyor.

Bu temel işlevler Perçinler'dedir ve eğer öyleyse, nasıl kurarım?

Answer 1

Rivets.js kaynağını açıklamalı okuduktan sonra, bir süre sonra çözüm buldu (Ben CoffeeScript kullanmıyorum, bu yüzden okumak için bir güçlük biraz oldu):

Ben orijinal parçasını yerini benim söz konusu kod: Bununla

rivets.binders.toggle = function(el,value){ 
    $(el).find('button[data-toggle-value="' + value + '"]') 
     .addClass('active').siblings().removeClass('active'); 
} 

:

rivets.binders.toggle = { 
    publishes: true, 
    bind: function(el){ 
     $(el).on('click', 'button:not(.active)', _.bind(function(e){ 
      this.model.set(this.keypath, $(e.currentTarget).data('toggle-value')); 
     }, this)); 
    }, 
    unbind: function(el){ 
     $(el).off('click', 'button:not(.active)'); 
    }, 
    routine: function(el,value){ 
     $(el).find('button[data-toggle-value="' + value + '"]') 
      .addClass('active').siblings().removeClass('active'); 
    } 
}; 

ilk kod rivets.binders.toggle.routine yerine rivets.binders.toggle altındadır.