Zmiana obserwowalnej wartości na liście rozwijanej Knockout Js

Question

Mam to menu rozwijane, które ma opcje, jeśli pojazd jest nowy lub używany.

<select name="VehicleType" id="vehicleTypeDropdown" data-bind="value: VehicleType">  
    <option value="New" selected="selected">Nuevo</option> 
    <option value="Used">Usado</option> 
</select> ` 

I to wejście:

<input type="text" name="Mileage" data-bind="disable: VehicleType() === 'New',value: Mileage" class="input-large"> ` 

Jeśli wartość w wybranej listy rozwijanej jest nowe wejście musi być wyłączony, a jeśli używane wejście powinno być włączone, ale jeśli wprowadzić wartość obserwowalny pobierze tę wartość i jeśli zmienię wartość rozwijaną na nową, obserwowalna musi być równa zero.

Answer 1

Ręczna subskrypcja w modelu widoku jest dobrym sposobem na poradzenie sobie z czymś takim. Subskrypcja może wyglądać następująco: http://jsfiddle.net/rniemeyer/h4cKC/

HTML::

<select name="VehicleType" id="vehicleTypeDropdown" data-bind="value: VehicleType"> 
    <option value="New" selected="selected">Nuevo</option> 
    <option value="Used">Usado</option> 
</select> 

<input type="text" name="Mileage" data-bind="disable: VehicleType() === 'New', value: Mileage" class="input-large"> 
<hr/> 

<pre data-bind="text: ko.toJSON($root, null, 2)"></pre> 

JS:

var ViewModel = function() { 
    this.VehicleType = ko.observable(); 
    this.Mileage = ko.observable(); 

    this.VehicleType.subscribe(function(newValue) { 
     if (newValue === "New") { 
      this.Mileage(0); 
     } 
    }, this); 
}; 

ko.applyBindings(new ViewModel()); 

Answer 2

this.VehicleType.subscribe(function(newValue) { 
    if (newValue === "New") { 
     this.Mileage(0); 
    } 
}, this); 

Oto próbka go za pomocąJeśli używasz ko mapping plugin, możesz przechwycić tworzenie nowego obiektu i skonfigurować tam subskrypcję. Jeśli masz całą listę przedmiotów i chcesz wykonać akcję, gdy coś się zmieni.

Jest to model widok elementu zamówienia Koszyk (właściwości, takie jak qty, sku, description, price).

// View Model for an item in my shopping cart 
var CartItemViewModel = function(data) 
{ 
    // map all the properties 
    // we could map manually if we want, but that's the whole point of 
    // the mapping plugin that we don't need to 
    ko.mapping.fromJS(data, {}, this); 

    // subscribe to qty change 
    this.qty.subscribe(function (newValue) 
    { 
     alert('qty now ' + this.qty()); 
     // UpdateCart() 

    }, this);  

    // add computed observables if needed 
    // .... 
} 

Podczas aktualizacji (lub utworzyć) swój model używając wtyczki mapowania określić, że dla nieruchomości o nazwie „przedmioty” każdy element tablicy powinien być utworzony z „tworzyć” funkcji można określić.

var mapping = 
    { 
     'items': 
     { 
      // map cart item 
      create: function (options) 
      { 
       return new CartItemViewModel(options.data); 
      } 
     } 
    }; 

    var data = ...... // get your data from somewhere 

    // update the CartViewModel using the mapping rules 
    ko.mapping.fromJS(data, mapping, rrvm.CartViewModel);